如何在运行到结束的包装文本字段中的所有行下创建一条虚线？
How to create a dotted line under all lines in a wrapping textField that runs to end?
我正在寻找一种方法来创建一个 jasper 报告元素，该元素将动态高度和标签文本框表示为 textField 随溢出延伸
文本框的内容应包括从头到尾每一行的虚线。
所需结果的草图。
最终决定
public class JRSplitText {
private String text;
private int firstLineCharacterCount = 0;
private AttributedString attributedString;
public JRSplitText(String text, String fontName, int fontStyle, float fontSize) {
this.text = text;
FontUtil fontUtil = FontUtil.getInstance(DefaultJasperReportsContext.getInstance());
Font font = fontUtil.getAwtFontFromBundles(fontName, fontStyle, fontSize, Locale.getDefault(), true);
attributedString = new AttributedString(text);
attributedString.addAttribute(TextAttribute.FONT, font);
}
public String getText(int wrappingWidth) {
if(text == null) {
return null;
}
AffineTransform transform = new AffineTransform();
FontRenderContext frc = new FontRenderContext(transform, true, true);
AttributedCharacterIterator iterator = attributedString.getIterator();
LineBreakMeasurer measurer = new LineBreakMeasurer(iterator, frc);
TextLayout layout = measurer.nextLayout(wrappingWidth);
firstLineCharacterCount = layout.getCharacterCount();
return text.substring(0, firstLineCharacterCount);
}
public JRDataSource getDataSource(int wrappingWidth) {
if(text == null) {
return null;
}
List<String> list = new ArrayList<>();
AffineTransform transform = new AffineTransform();
FontRenderContext frc = new FontRenderContext(transform, true, true);
AttributedCharacterIterator iterator = attributedString.getIterator();
LineBreakMeasurer measurer = new LineBreakMeasurer(iterator, frc);
measurer.setPosition(firstLineCharacterCount);
while (measurer.getPosition() < iterator.getEndIndex()) {
TextLayout layout = measurer.nextLayout(wrappingWidth);
String line = text.substring(measurer.getPosition() - layout.getCharacterCount(), measurer.getPosition());
list.add(line);
}
if(list.isEmpty()) {
return null;
}
return new JRBeanCollectionDataSource(list);
}
}
并测试 jrxml 文件
<?xml version="1.0" encoding="UTF-8"?>
<!-- Created with Jaspersoft Studio version 6.4.0.final using JasperReports Library version 6.4.1 -->
<jasperReport xmlns="http://jasperreports.sourceforge.net/jasperreports" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://jasperreports.sourceforge.net/jasperreports http://jasperreports.sourceforge.net/xsd/jasperreport.xsd" name="Blank_A4_1" pageWidth="595" pageHeight="842" columnWidth="555" leftMargin="20" rightMargin="20" topMargin="20" bottomMargin="20" uuid="f9a6be97-9be4-4067-9185-a2a909bd704c">
<property name="com.jaspersoft.studio.data.defaultdataadapter" value="One Empty Record"/>
<subDataset name="Dataset1" uuid="ebf3dce1-fb7a-427e-b156-4053fbbdd833">
<queryString>
<![CDATA[]]>
</queryString>
<field name="_THIS" class="java.lang.String"/>
</subDataset>
<parameter name="lorem ipsum" class="java.lang.String"/>
<parameter name="testParam" class="JRSplitText" isForPrompting="false">
<parameterDescription><![CDATA[]]></parameterDescription>
<defaultValueExpression><![CDATA[new JRSplitText($P{lorem ipsum}, "SansSerif", java.awt.Font.BOLD, 10.0f)]]></defaultValueExpression>
</parameter>
<queryString>
<![CDATA[]]>
</queryString>
<background>
<band splitType="Stretch"/>
</background>
<columnHeader>
<band height="16" splitType="Stretch">
<frame>
<reportElement x="0" y="0" width="556" height="0" uuid="422c3774-9917-4908-af5d-d695eb4c0af0">
<property name="com.jaspersoft.studio.unit.height" value="pixel"/>
</reportElement>
<box>
<topPen lineWidth="0.0" lineStyle="Solid" lineColor="#000000"/>
<leftPen lineWidth="0.0" lineStyle="Solid" lineColor="#000000"/>
<bottomPen lineWidth="0.0" lineStyle="Solid" lineColor="#000000"/>
<rightPen lineWidth="0.0" lineStyle="Solid" lineColor="#000000"/>
</box>
<staticText>
<reportElement x="0" y="0" width="100" height="18" uuid="258f51ab-e5f3-4c84-a483-87d03ff4adf7"/>
<textElement verticalAlignment="Bottom"/>
<text><![CDATA[This is a Label:]]></text>
</staticText>
<textField>
<reportElement x="100" y="0" width="456" height="18" uuid="aadc75c9-2599-4051-a37d-af3583ec3635"/>
<box>
<bottomPen lineWidth="1.0" lineStyle="Dotted"/>
</box>
<textElement verticalAlignment="Bottom">
<font fontName="SansSerif" size="10" isBold="true"/>
<paragraph leftIndent="2"/>
</textElement>
<textFieldExpression><![CDATA[$P{testParam}.getText(454)]]></textFieldExpression>
</textField>
<staticText>
<reportElement x="100" y="18" width="456" height="8" uuid="059e4872-c8f0-44f7-ac32-4e7b42ce1942">
<property name="com.jaspersoft.studio.unit.height" value="pixel"/>
</reportElement>
<textElement textAlignment="Center">
<font size="6"/>
</textElement>
<text><![CDATA[(hint ...)]]></text>
</staticText>
<componentElement>
<reportElement x="0" y="18" width="556" height="18" isRemoveLineWhenBlank="true" uuid="aaa64777-42be-45ff-8045-9916e75aaf31"/>
<jr:list xmlns:jr="http://jasperreports.sourceforge.net/jasperreports/components" xsi:schemaLocation="http://jasperreports.sourceforge.net/jasperreports/components http://jasperreports.sourceforge.net/xsd/components.xsd" printOrder="Vertical">
<datasetRun subDataset="Dataset1" uuid="5f0160cd-5fef-43e9-970e-fde5226a2aeb">
<dataSourceExpression><![CDATA[$P{testParam}.getDataSource(556)]]></dataSourceExpression>
</datasetRun>
<jr:listContents height="18" width="556">
<textField isBlankWhenNull="false">
<reportElement x="0" y="0" width="556" height="18" isRemoveLineWhenBlank="true" uuid="f0ba1742-9bae-452c-9e98-3518e0951571">
<property name="com.jaspersoft.studio.unit.height" value="pixel"/>
</reportElement>
<box>
<bottomPen lineWidth="1.0" lineStyle="Dotted"/>
</box>
<textElement verticalAlignment="Bottom">
<font isBold="true"/>
<paragraph leftIndent="0"/>
</textElement>
<textFieldExpression><![CDATA[$F{_THIS}]]></textFieldExpression>
</textField>
</jr:listContents>
</jr:list>
</componentElement>
</frame>
<staticText>
<reportElement positionType="Float" x="455" y="0" width="100" height="16" forecolor="#857D7D" uuid="8bee13b8-2322-489b-8ab0-2e3c7c6742d1">
<property name="com.jaspersoft.studio.unit.y" value="pixel"/>
</reportElement>
<textElement textAlignment="Right"/>
<text><![CDATA[Static Text]]></text>
</staticText>
</band>
</columnHeader>
</jasperReport>
JasperReports 中没有可让您直接实现此目的的设置，最简单的策略之一可能是将您的文本转换为数据源，因此是一个行列表，然后在文本字段中显示每一行，并带有虚线它下面的线。
要创建数据源，我们需要计算换行的时间，为此我们需要使用 java，我将使用 LineBreakMeasurer
Java 将长文本转换为行列表的代码，具体取决于 wrappingWidth 和 Font
public class JRSplitText {
public static JRDataSource getTextDataSource(String text, int wrappingWidth, String fontName, int fontStyle, int fontSize) {
// Our list with the different text segements (lines)
List<String> textSegements = new ArrayList<>();
// Instance a FontRenderContext
AffineTransform affinetransform = new AffineTransform();
FontRenderContext frc = new FontRenderContext(affinetransform, true, true);
// Instance the AttributedString and it's iterator
AttributedString attrText = new AttributedString(text);
// To consider font-extensions lets load font directly from jasper-reports
FontUtil fontUtil = FontUtil.getInstance(DefaultJasperReportsContext.getInstance());
Font font = fontUtil.getAwtFontFromBundles(fontName, fontStyle, fontSize, Locale.getDefault(), false);
attrText.addAttribute(TextAttribute.FONT, font);
AttributedCharacterIterator styledText = attrText.getIterator();
// Start measurer how much text can fit in our width and add each line
// to our list
LineBreakMeasurer measurer = new LineBreakMeasurer(styledText, frc);
while (measurer.getPosition() < styledText.getEndIndex()) {
TextLayout layout = measurer.nextLayout(wrappingWidth);
String line = text.substring(measurer.getPosition() - layout.getCharacterCount(), measurer.getPosition());
textSegements.add(line);
}
// return a datasource of our lists
return new JRBeanCollectionDataSource(textSegements);
}
}
使用 classpath 中的这段代码，我们可以直接从 jrxml 中使用我们的文本和字体调用它来获取数据源。
JasperReports - jrxml，我们将调用上面的 class 并在参数中添加一些文本（它可以是字段或变量），例如我正在使用jr:list 组件迭代数据源，但您也可以使用普通子报表。
<?xml version="1.0" encoding="UTF-8"?>
<jasperReport xmlns="http://jasperreports.sourceforge.net/jasperreports" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://jasperreports.sourceforge.net/jasperreports http://jasperreports.sourceforge.net/xsd/jasperreport.xsd" name="lineBreakTest" pageWidth="595" pageHeight="842" whenNoDataType="AllSectionsNoDetail" columnWidth="555" leftMargin="20" rightMargin="20" topMargin="20" bottomMargin="20" uuid="597c0716-df6b-42ec-a7c8-863eb1b7174a">
<property name="com.jaspersoft.studio.data.defaultdataadapter" value="One Empty Record"/>
<subDataset name="datasource" uuid="6a442aa1-3bf1-494c-9654-e6d3122dd5a7">
<queryString>
<![CDATA[]]>
</queryString>
<field name="_THIS" class="java.lang.String"/>
</subDataset>
<parameter name="text" class="java.lang.String">
<defaultValueExpression><![CDATA["Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."]]></defaultValueExpression>
</parameter>
<title>
<band height="18">
<componentElement>
<reportElement positionType="Float" x="2" y="0" width="550" height="15" uuid="3a68753d-ac77-4941-9dd9-fdeca5ad2f76"/>
<jr:list xmlns:jr="http://jasperreports.sourceforge.net/jasperreports/components" xsi:schemaLocation="http://jasperreports.sourceforge.net/jasperreports/components http://jasperreports.sourceforge.net/xsd/components.xsd" printOrder="Vertical">
<datasetRun subDataset="datasource" uuid="a76bcffd-57ad-44bf-b2c9-20b89089e440">
<dataSourceExpression><![CDATA[jdd.so.JRSplitText.getTextDataSource($P{text},550,"SansSerif",java.awt.Font.PLAIN,10)]]></dataSourceExpression>
</datasetRun>
<jr:listContents height="15" width="550">
<textField>
<reportElement x="0" y="0" width="550" height="15" uuid="c9685fa5-a942-4709-9fa9-98e9cc80bc5c"/>
<box>
<bottomPen lineWidth="1.0" lineStyle="Dotted"/>
</box>
<textElement>
<font fontName="SansSerif" size="10"/>
</textElement>
<textFieldExpression><![CDATA[$F{_THIS}]]></textFieldExpression>
</textField>
</jr:listContents>
</jr:list>
</componentElement>
</band>
</title>
</jasperReport>
输出
屏幕截图中的虚线看起来不太好，但这只是一个屏幕截图问题
Note: wrappingWidth and font parameters, is our width of textField and its font. The line height is controlled by height of textField
我正在寻找一种方法来创建一个 jasper 报告元素，该元素将动态高度和标签文本框表示为 textField 随溢出延伸
文本框的内容应包括从头到尾每一行的虚线。
所需结果的草图。
最终决定
public class JRSplitText {
private String text;
private int firstLineCharacterCount = 0;
private AttributedString attributedString;
public JRSplitText(String text, String fontName, int fontStyle, float fontSize) {
this.text = text;
FontUtil fontUtil = FontUtil.getInstance(DefaultJasperReportsContext.getInstance());
Font font = fontUtil.getAwtFontFromBundles(fontName, fontStyle, fontSize, Locale.getDefault(), true);
attributedString = new AttributedString(text);
attributedString.addAttribute(TextAttribute.FONT, font);
}
public String getText(int wrappingWidth) {
if(text == null) {
return null;
}
AffineTransform transform = new AffineTransform();
FontRenderContext frc = new FontRenderContext(transform, true, true);
AttributedCharacterIterator iterator = attributedString.getIterator();
LineBreakMeasurer measurer = new LineBreakMeasurer(iterator, frc);
TextLayout layout = measurer.nextLayout(wrappingWidth);
firstLineCharacterCount = layout.getCharacterCount();
return text.substring(0, firstLineCharacterCount);
}
public JRDataSource getDataSource(int wrappingWidth) {
if(text == null) {
return null;
}
List<String> list = new ArrayList<>();
AffineTransform transform = new AffineTransform();
FontRenderContext frc = new FontRenderContext(transform, true, true);
AttributedCharacterIterator iterator = attributedString.getIterator();
LineBreakMeasurer measurer = new LineBreakMeasurer(iterator, frc);
measurer.setPosition(firstLineCharacterCount);
while (measurer.getPosition() < iterator.getEndIndex()) {
TextLayout layout = measurer.nextLayout(wrappingWidth);
String line = text.substring(measurer.getPosition() - layout.getCharacterCount(), measurer.getPosition());
list.add(line);
}
if(list.isEmpty()) {
return null;
}
return new JRBeanCollectionDataSource(list);
}
}
并测试 jrxml 文件
<?xml version="1.0" encoding="UTF-8"?>
<!-- Created with Jaspersoft Studio version 6.4.0.final using JasperReports Library version 6.4.1 -->
<jasperReport xmlns="http://jasperreports.sourceforge.net/jasperreports" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://jasperreports.sourceforge.net/jasperreports http://jasperreports.sourceforge.net/xsd/jasperreport.xsd" name="Blank_A4_1" pageWidth="595" pageHeight="842" columnWidth="555" leftMargin="20" rightMargin="20" topMargin="20" bottomMargin="20" uuid="f9a6be97-9be4-4067-9185-a2a909bd704c">
<property name="com.jaspersoft.studio.data.defaultdataadapter" value="One Empty Record"/>
<subDataset name="Dataset1" uuid="ebf3dce1-fb7a-427e-b156-4053fbbdd833">
<queryString>
<![CDATA[]]>
</queryString>
<field name="_THIS" class="java.lang.String"/>
</subDataset>
<parameter name="lorem ipsum" class="java.lang.String"/>
<parameter name="testParam" class="JRSplitText" isForPrompting="false">
<parameterDescription><![CDATA[]]></parameterDescription>
<defaultValueExpression><![CDATA[new JRSplitText($P{lorem ipsum}, "SansSerif", java.awt.Font.BOLD, 10.0f)]]></defaultValueExpression>
</parameter>
<queryString>
<![CDATA[]]>
</queryString>
<background>
<band splitType="Stretch"/>
</background>
<columnHeader>
<band height="16" splitType="Stretch">
<frame>
<reportElement x="0" y="0" width="556" height="0" uuid="422c3774-9917-4908-af5d-d695eb4c0af0">
<property name="com.jaspersoft.studio.unit.height" value="pixel"/>
</reportElement>
<box>
<topPen lineWidth="0.0" lineStyle="Solid" lineColor="#000000"/>
<leftPen lineWidth="0.0" lineStyle="Solid" lineColor="#000000"/>
<bottomPen lineWidth="0.0" lineStyle="Solid" lineColor="#000000"/>
<rightPen lineWidth="0.0" lineStyle="Solid" lineColor="#000000"/>
</box>
<staticText>
<reportElement x="0" y="0" width="100" height="18" uuid="258f51ab-e5f3-4c84-a483-87d03ff4adf7"/>
<textElement verticalAlignment="Bottom"/>
<text><![CDATA[This is a Label:]]></text>
</staticText>
<textField>
<reportElement x="100" y="0" width="456" height="18" uuid="aadc75c9-2599-4051-a37d-af3583ec3635"/>
<box>
<bottomPen lineWidth="1.0" lineStyle="Dotted"/>
</box>
<textElement verticalAlignment="Bottom">
<font fontName="SansSerif" size="10" isBold="true"/>
<paragraph leftIndent="2"/>
</textElement>
<textFieldExpression><![CDATA[$P{testParam}.getText(454)]]></textFieldExpression>
</textField>
<staticText>
<reportElement x="100" y="18" width="456" height="8" uuid="059e4872-c8f0-44f7-ac32-4e7b42ce1942">
<property name="com.jaspersoft.studio.unit.height" value="pixel"/>
</reportElement>
<textElement textAlignment="Center">
<font size="6"/>
</textElement>
<text><![CDATA[(hint ...)]]></text>
</staticText>
<componentElement>
<reportElement x="0" y="18" width="556" height="18" isRemoveLineWhenBlank="true" uuid="aaa64777-42be-45ff-8045-9916e75aaf31"/>
<jr:list xmlns:jr="http://jasperreports.sourceforge.net/jasperreports/components" xsi:schemaLocation="http://jasperreports.sourceforge.net/jasperreports/components http://jasperreports.sourceforge.net/xsd/components.xsd" printOrder="Vertical">
<datasetRun subDataset="Dataset1" uuid="5f0160cd-5fef-43e9-970e-fde5226a2aeb">
<dataSourceExpression><![CDATA[$P{testParam}.getDataSource(556)]]></dataSourceExpression>
</datasetRun>
<jr:listContents height="18" width="556">
<textField isBlankWhenNull="false">
<reportElement x="0" y="0" width="556" height="18" isRemoveLineWhenBlank="true" uuid="f0ba1742-9bae-452c-9e98-3518e0951571">
<property name="com.jaspersoft.studio.unit.height" value="pixel"/>
</reportElement>
<box>
<bottomPen lineWidth="1.0" lineStyle="Dotted"/>
</box>
<textElement verticalAlignment="Bottom">
<font isBold="true"/>
<paragraph leftIndent="0"/>
</textElement>
<textFieldExpression><![CDATA[$F{_THIS}]]></textFieldExpression>
</textField>
</jr:listContents>
</jr:list>
</componentElement>
</frame>
<staticText>
<reportElement positionType="Float" x="455" y="0" width="100" height="16" forecolor="#857D7D" uuid="8bee13b8-2322-489b-8ab0-2e3c7c6742d1">
<property name="com.jaspersoft.studio.unit.y" value="pixel"/>
</reportElement>
<textElement textAlignment="Right"/>
<text><![CDATA[Static Text]]></text>
</staticText>
</band>
</columnHeader>
</jasperReport>
JasperReports 中没有可让您直接实现此目的的设置，最简单的策略之一可能是将您的文本转换为数据源，因此是一个行列表，然后在文本字段中显示每一行，并带有虚线它下面的线。
要创建数据源，我们需要计算换行的时间，为此我们需要使用 java，我将使用 LineBreakMeasurer
Java 将长文本转换为行列表的代码，具体取决于 wrappingWidth 和 Font
public class JRSplitText {
public static JRDataSource getTextDataSource(String text, int wrappingWidth, String fontName, int fontStyle, int fontSize) {
// Our list with the different text segements (lines)
List<String> textSegements = new ArrayList<>();
// Instance a FontRenderContext
AffineTransform affinetransform = new AffineTransform();
FontRenderContext frc = new FontRenderContext(affinetransform, true, true);
// Instance the AttributedString and it's iterator
AttributedString attrText = new AttributedString(text);
// To consider font-extensions lets load font directly from jasper-reports
FontUtil fontUtil = FontUtil.getInstance(DefaultJasperReportsContext.getInstance());
Font font = fontUtil.getAwtFontFromBundles(fontName, fontStyle, fontSize, Locale.getDefault(), false);
attrText.addAttribute(TextAttribute.FONT, font);
AttributedCharacterIterator styledText = attrText.getIterator();
// Start measurer how much text can fit in our width and add each line
// to our list
LineBreakMeasurer measurer = new LineBreakMeasurer(styledText, frc);
while (measurer.getPosition() < styledText.getEndIndex()) {
TextLayout layout = measurer.nextLayout(wrappingWidth);
String line = text.substring(measurer.getPosition() - layout.getCharacterCount(), measurer.getPosition());
textSegements.add(line);
}
// return a datasource of our lists
return new JRBeanCollectionDataSource(textSegements);
}
}
使用 classpath 中的这段代码，我们可以直接从 jrxml 中使用我们的文本和字体调用它来获取数据源。
JasperReports - jrxml，我们将调用上面的 class 并在参数中添加一些文本（它可以是字段或变量），例如我正在使用jr:list 组件迭代数据源，但您也可以使用普通子报表。
<?xml version="1.0" encoding="UTF-8"?>
<jasperReport xmlns="http://jasperreports.sourceforge.net/jasperreports" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://jasperreports.sourceforge.net/jasperreports http://jasperreports.sourceforge.net/xsd/jasperreport.xsd" name="lineBreakTest" pageWidth="595" pageHeight="842" whenNoDataType="AllSectionsNoDetail" columnWidth="555" leftMargin="20" rightMargin="20" topMargin="20" bottomMargin="20" uuid="597c0716-df6b-42ec-a7c8-863eb1b7174a">
<property name="com.jaspersoft.studio.data.defaultdataadapter" value="One Empty Record"/>
<subDataset name="datasource" uuid="6a442aa1-3bf1-494c-9654-e6d3122dd5a7">
<queryString>
<![CDATA[]]>
</queryString>
<field name="_THIS" class="java.lang.String"/>
</subDataset>
<parameter name="text" class="java.lang.String">
<defaultValueExpression><![CDATA["Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."]]></defaultValueExpression>
</parameter>
<title>
<band height="18">
<componentElement>
<reportElement positionType="Float" x="2" y="0" width="550" height="15" uuid="3a68753d-ac77-4941-9dd9-fdeca5ad2f76"/>
<jr:list xmlns:jr="http://jasperreports.sourceforge.net/jasperreports/components" xsi:schemaLocation="http://jasperreports.sourceforge.net/jasperreports/components http://jasperreports.sourceforge.net/xsd/components.xsd" printOrder="Vertical">
<datasetRun subDataset="datasource" uuid="a76bcffd-57ad-44bf-b2c9-20b89089e440">
<dataSourceExpression><![CDATA[jdd.so.JRSplitText.getTextDataSource($P{text},550,"SansSerif",java.awt.Font.PLAIN,10)]]></dataSourceExpression>
</datasetRun>
<jr:listContents height="15" width="550">
<textField>
<reportElement x="0" y="0" width="550" height="15" uuid="c9685fa5-a942-4709-9fa9-98e9cc80bc5c"/>
<box>
<bottomPen lineWidth="1.0" lineStyle="Dotted"/>
</box>
<textElement>
<font fontName="SansSerif" size="10"/>
</textElement>
<textFieldExpression><![CDATA[$F{_THIS}]]></textFieldExpression>
</textField>
</jr:listContents>
</jr:list>
</componentElement>
</band>
</title>
</jasperReport>
输出
屏幕截图中的虚线看起来不太好，但这只是一个屏幕截图问题
Note:
wrappingWidthand font parameters, is our width oftextFieldand its font. The line height is controlled by height oftextField