画布的StaticLayout定位中心不像canvas.drawText那样工作？答案

【问题标题】：StaticLayout positioning center of canvas not working like canvas.drawText?画布的StaticLayout定位中心不像canvas.drawText那样工作？
【发布时间】：2019-11-08 05:24:11
【问题描述】：

在使用通常的drawText 绘图时，文本定位到画布的中心。但我的要求是放置多行文本，所以我必须使用 StaticLayout，但 StaticLayout 并没有像 drawText 那样放置这是我迄今为止尝试过的。

class TestView : View {

private lateinit var staticLayout: StaticLayout
private lateinit var ststicTextPaint: TextPaint
private lateinit var textPaint: TextPaint
private val helloworld = "Hello world!"

constructor(context: Context, attrs: AttributeSet) : super(context, attrs) {
  
}

constructor(context: Context, attrs: AttributeSet, defStyleAttr: Int) : super(
    context,
    attrs,
    defStyleAttr
) {
}

@TargetApi(Build.VERSION_CODES.LOLLIPOP)
constructor(context: Context, attrs: AttributeSet, defStyleAttr: Int, defStyleRes: Int) : super(
    context,
    attrs,
    defStyleAttr,
    defStyleRes
) {
}

override fun onSizeChanged(w: Int, h: Int, oldw: Int, oldh: Int) {
    super.onSizeChanged(w, h, oldw, oldh)
    setUp(w, h)
}

private fun setUp(w: Int, h: Int) {
    textPaint = TextPaint(Paint.ANTI_ALIAS_FLAG)
    textPaint.color = Color.BLUE
    textPaint.textSize = 40f
    textPaint.textAlign = Paint.Align.CENTER

    ststicTextPaint = TextPaint(Paint.ANTI_ALIAS_FLAG)
    ststicTextPaint.color = Color.GREEN
    ststicTextPaint.textSize = 40f
  //  textPaint.textAlign = Paint.Align.CENTER

    staticLayout = StaticLayout(
        helloworld,
        ststicTextPaint,
        w,
        Layout.Alignment.ALIGN_CENTER,
        0f,
        0f,
        false
    )
}

override fun onDraw(canvas: Canvas?) {
    super.onDraw(canvas)
    //Just drawn a rect with cross-hair to know the relative position
    val rect = Rect(0, 0, width, height)
    val paint = Paint(Paint.ANTI_ALIAS_FLAG)
    paint.style = Paint.Style.STROKE
    paint.color = Color.RED
    paint.strokeWidth = 5f
    canvas?.drawRect(rect, paint)
    canvas?.drawLine((width/2).toFloat(), 0F, (width/2).toFloat(), height.toFloat(),paint)
    canvas?.drawLine(0F, (height/2).toFloat(),width.toFloat(), (height/2).toFloat(),paint)

    canvas?.drawText(helloworld, (width / 2).toFloat(), (height / 2).toFloat(), textPaint)
    //   canvas?.drawText(helloworld, (width / 2).toFloat(), (height / 2).toFloat(), textPaint)
    staticLayout.draw(canvas, (width / 2).toFloat(), (height / 2).toFloat())
}

fun StaticLayout.draw(canvas: Canvas?, x: Float, y: Float) {
    canvas?.withTranslation(x, y) {
        draw(canvas)
    }
  }
}

这就是我得到的两个蓝色的是使用普通的drawText，绿色的是使用StaticLayout

【问题讨论】：

标签： android android-canvas android-custom-view drawtext staticlayout

【解决方案1】：

伙计们，我发现了问题所在。这是因为我忽略了 StaticLayout 文本的宽度，而将其放置到中心。

这里我给了 StaticLayout 整个视图的宽度。

    staticLayout = StaticLayout(
        "Hello world is helloworld",
        ststicTextPaint,
        w,
        Layout.Alignment.ALIGN_CENTER,
        1f,
        0f,
        false
    )

绘制视图时

staticLayout.draw(canvas, ((width / 2)-staticLayout.width/2).toFloat(), (height / 2).toFloat())

我减去了 `StaticLayout 宽度的一半，这样它就可以放在正中心了。

【讨论】：