使用CheckBox进行文本对齐

时间:2018-04-13 11:21:16

标签: dart flutter

我在下面的代码中显示带复选框的文本,我需要文本位于最左侧,复选框位于最右侧,我正确选中了复选框,但是文本如图所示,它已经与它的侧面对齐,我希望结果显示它们之间有很大的差距!

  var _valueC = false;
  void onChecked(bool value) {
    setState(() {
      _valueC = value;
      print('value: $value');
    });
  }

new Card(
  child: new Container(
    // height: 100.0,
    child: new Row(
      mainAxisAlignment: MainAxisAlignment.end,
      children: <Widget>[
        new Text("Agree"),
        new Checkbox(value: _valueC,
            onChanged: onChecked,
            ),
       ],
    ),
  ),
),

enter image description here

我在下面的案例中使用了Kotlin与Switch及其文本完美配合:

class Switchy : RelativeLayout {
    constructor(context: Context) : super(context) {
        init(context)
    }

    private fun init(context: Context) {
        val colorOn = -0xcdc1ba

        val trackStates = ColorStateList(
                arrayOf(intArrayOf(-android.R.attr.state_checked), intArrayOf()),
                intArrayOf(Color.LTGRAY, colorOn)
        )

        this.apply {
            layoutParams = android.widget.RelativeLayout.LayoutParams(
                    LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT)

            addView(Switch(context).apply {
                    background =  ContextCompat.getDrawable(context, R.drawable.card)
                    text = "active or not is it  ?"
                    isChecked = true
                    showText = true
                    textOn = "Active"
                    textOff = "Not Active"
                    trackTintList = trackStates
                    thumbTintList = trackStates
                }, LayoutParams(LayoutParams.MATCH_PARENT,
            LayoutParams.WRAP_CONTENT))
        }
    }
}

1 个答案:

答案 0 :(得分:2)

使用

mainAxisAlignment: MainAxisAlignment.spaceBetween,

而不是

mainAxisAlignment: MainAxisAlignment.end,
相关问题