首页 > 解决方案 > 不同字体大小的画布

问题描述

我使用以下函数将字符串转换为 Android 中的位图:

 static public Bitmap createBitmapFromText(String printText, int textSize, int printWidth, Typeface typeface) {
    Paint paint = new Paint();
    Bitmap bitmap;
    Canvas canvas;

    paint.setTextSize(textSize);
    paint.setTypeface(typeface);

    paint.getTextBounds(printText, 0, printText.length(), new Rect());

    TextPaint textPaint = new TextPaint(paint);
    android.text.StaticLayout staticLayout = new StaticLayout(printText, textPaint, printWidth, Layout.Alignment.ALIGN_NORMAL, 1, 0, false);


    // Create bitmap
    bitmap = Bitmap.createBitmap(staticLayout.getWidth(), staticLayout.getHeight(), Bitmap.Config.ARGB_8888);

    // Create canvas
    canvas = new Canvas(bitmap);
    canvas.drawColor(Color.WHITE);
    canvas.translate(0, 0);
    staticLayout.draw(canvas);

    return bitmap;
}

我想对其进行转换,以便可以创建具有不同字体样式的位图,如下所示:

static public Bitmap createBitmapFromText(String[] texts, int[] textSizes, int printWidth, Typeface typeface) {
}

有什么方法可以将多个具有不同样式的 TextPaint 对象附加到 StaticLayout 中?

结果将类似于

#invoice-POS{
  padding:2mm;
  margin: 0 auto;
  width: 44mm;
  background: #FFF;
  
h1{
  font-size: 1.5em;
  color: #222;
}
h2{font-size: .9em;}
h3{
  font-size: 1.2em;
  font-weight: 300;
  line-height: 2em;
}
p{
  font-size: .7em;
  color: #666;
  line-height: 1.2em;
}
 
#top, #mid,#bot{ /* Targets all id with 'col-' */
  border-bottom: 1px solid #EEE;
}

#top{min-height: 100px;}
#mid{min-height: 80px;} 
#bot{ min-height: 50px;}

#top .logo{
  //float: left;
	height: 60px;
	width: 60px;
	background: url(http://michaeltruong.ca/images/logo1.png) no-repeat;
	background-size: 60px 60px;
}
.clientlogo{
  float: left;
	height: 60px;
	width: 60px;
	background: url(http://michaeltruong.ca/images/client.jpg) no-repeat;
	background-size: 60px 60px;
  border-radius: 50px;
}
.info{
  display: block;
  //float:left;
  margin-left: 0;
}
.title{
  float: right;
}
.title p{text-align: right;} 
table{
  width: 100%;
  border-collapse: collapse;
}
td{
  //padding: 5px 0 5px 15px;
  //border: 1px solid #EEE
}
.tabletitle{
  //padding: 5px;
  font-size: .5em;
  background: #EEE;
}
.service{border-bottom: 1px solid #EEE;}
.item{width: 24mm;}
.itemtext{font-size: .5em;}
#legalcopy{
  margin-top: 5mm;
}

  
  
}
  <div id="invoice-POS">
    
    <center id="top">
      <div class="logo"></div>
    </center><!--End InvoiceTop-->
    
    <div id="mid">
      <div class="info">
        <h2>Contact Info</h2>
        <p> 
            Address : street city, state 0000</br>
            Email   : JohnDoe@gmail.com</br>
            Phone   : 555-555-5555</br>
        </p>
      </div>
    </div><!--End Invoice Mid-->
    
    <div id="bot">

					<div id="table">
						<table>
							<tr class="tabletitle">
								<td class="item"><h2>Item</h2></td>
								<td class="Hours"><h2>Qty</h2></td>
								<td class="Rate"><h2>Sub Total</h2></td>
							</tr>

							<tr class="service">
								<td class="tableitem"><p class="itemtext">Communication</p></td>
								<td class="tableitem"><p class="itemtext">5</p></td>
								<td class="tableitem"><p class="itemPrice">$375.00</p></td>
							</tr>

							<tr class="service">
								<td class="tableitem"><p class="itemtext">Asset Gathering</p></td>
								<td class="tableitem"><p class="itemtext">3</p></td>
								<td class="tableitem"><p class="itemPrice">$225.00</p></td>
							</tr>

							<tr class="service">
								<td class="tableitem"><p class="itemtext">Design Development</p></td>
								<td class="tableitem"><p class="itemtext">5</p></td>
								<td class="tableitem"><p class="itemPrice">$375.00</p></td>
							</tr>

							<tr class="service">
								<td class="tableitem"><p class="itemtext">Animation</p></td>
								<td class="tableitem"><p class="itemtext">20</p></td>
								<td class="tableitem"><p class="itemPrice">$1500.00</p></td>
							</tr>

							<tr class="service">
								<td class="tableitem"><p class="itemtext">Animation Revisions</p></td>
								<td class="tableitem"><p class="itemtext">10</p></td>
								<td class="tableitem"><p class="itemPrice">$750.00</p></td>
							</tr>


							<tr class="tabletitle">
								<td></td>
								<td class="Rate"><h2>tax</h2></td>
								<td class="payment"><h2>$419.25</h2></td>
							</tr>

							<tr class="tabletitle">
								<td></td>
								<td class="Rate"><h2>Total</h2></td>
								<td class="payment"><h2>$3,644.25</h2></td>
							</tr>

						</table>
					</div><!--End Table-->

					<div id="legalcopy">
						<p class="legal"><strong>Thank you for your business!</strong>  Payment is expected within 31 days; please process this invoice within that time. There will be a 5% interest charge per month on late invoices. 
						</p>
					</div>

				</div><!--End InvoiceBot-->
  </div><!--End Invoice-->

更新:我修改了函数以获取格式化文本数组而不是单个字符串,并且我按照 dpskink 的建议使用 SpannableStrings。

class FormattedString {
    public FormattedString(String text, int fontSize) {
        this.text = text;
        this.fontSize = fontSize;
    }

    public String text;

    public int fontSize;
}

static public Bitmap createBitmapFromTexts(FormattedString[] formattedStrings, int textSize, int printWidth, Typeface typeface) {
    Paint paint = new Paint();
    Bitmap bitmap;
    Canvas canvas;

    paint.setTextSize(textSize);
    paint.setTypeface(typeface);

    paint.getTextBounds(formattedStrings[0].text, 0, formattedStrings[0].text.length(), new Rect());
    TextPaint textPaint = new TextPaint(paint);
    SpannableString[] spannableStrings = new SpannableString[formattedStrings.length];
    for (int i = 0; i < formattedStrings.length; i++) {
        SpannableString spannableString = new SpannableString(formattedStrings[i].text);
        spannableString.setSpan(new RelativeSizeSpan(formattedStrings[i].fontSize), 0, formattedStrings[i].text.length(), 0);
        spannableStrings[i] = spannableString;
    }

    CharSequence text = TextUtils.concat(spannableStrings);

    android.text.StaticLayout staticLayout = new StaticLayout(text, textPaint, printWidth, Layout.Alignment.ALIGN_NORMAL, 1, 0, false);

    // Create bitmap
    bitmap = Bitmap.createBitmap(staticLayout.getWidth(), staticLayout.getHeight(), Bitmap.Config.ARGB_8888);

    // Create canvas
    canvas = new Canvas(bitmap);
    canvas.drawColor(Color.WHITE);
    canvas.translate(0, 0);
    staticLayout.draw(canvas);

    return bitmap;
}

从我的主要活动:

    int textSize = 25;
    Typeface typeface = Typeface.create(Typeface.MONOSPACE, Typeface.NORMAL);
    FormattedString[] formattedStrings = {
            new FormattedString("****ORDER NUMBER 1111***", 1),
            new FormattedString("****222", 2),
            new FormattedString("*33***", 3),
            new FormattedString("****222*", 2),
            new FormattedString("****111***", 1),
            new FormattedString("****222***", 2)
    };

    return createBitmapFromTexts(formattedStrings, textSize, PrinterSettingConstant.PAPER_SIZE_THREE_INCH, typeface);

似乎它正在工作。唯一让我困扰的是 Paint/TextPaint 对象,它们是为带有转储数据的 StaticLayout 构造函数创建的...

标签: androidandroid-canvasstaticlayout

解决方案


推荐阅读