flutter - 如何设置这种文本字段的样式

Question

我想设置这种TextField的样式。

我面临的主要问题是设计领导TextField的美元部分。到目前为止，这是我的代码。

/// My Place Bid Text Field
      Container(
        decoration: BoxDecoration(
          border: Border.all(color: Colors.grey),
          borderRadius: BorderRadius.circular(4),
        ),
        child: Row(
          mainAxisSize: MainAxisSize.max,
          children: [
            SizedBox(
              child: Container(
              //width: mySize.width * 0.2,
              //height: 50,
                padding: const EdgeInsets.all(8),
                decoration: BoxDecoration(
                    border: Border.all(color: Colors.grey),
                    borderRadius: BorderRadius.only(
                      topLeft: Radius.circular(4),
                      bottomLeft: Radius.circular(4),
                    ),
                    color: Colors.grey[200]),
                child: Text(
                  "RS \u20B9",
                  style: TextStyle(fontSize: 24),
                ),
              ),
            ),
            Expanded(
              child: TextField(
                decoration: InputDecoration(
                    border: InputBorder.none,
                    labelText: "Place Bid",
                    labelStyle: TextStyle(fontSize: 24)),
              ),
            ),
          ],
        ),
      ),

这给了我输出

我知道这个问题并不复杂，但是我还是比较陌生，因此非常感谢您的帮助。

Answer 1

@override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text("Sample"),
        ),
        body: Padding(
          padding: EdgeInsets.all(10),
          child: Container(
            decoration: BoxDecoration(
                border: Border.all(
                  color: Colors.grey[500],
                ),
                borderRadius: BorderRadius.all(Radius.circular(8))),
            width: double.infinity,
            height: 50,
            child: Row(
              children: <Widget>[
                Container(
                    padding: EdgeInsets.all(10),
                    color: Colors.grey.shade300,
                    height: 50,
                    child: Align(
                      alignment: Alignment.center,
                      child: Text(
                        "RS \u20B9",
                        style: TextStyle(
                            fontSize: 24, fontWeight: FontWeight.bold),
                      ),
                    )),
                SizedBox(
                  width: 10,
                ),
                Expanded(
                    child: Container(
                        height: 50,
                        child: TextField(
                          decoration: InputDecoration(
                              border: InputBorder.none,
                              hintText: "Enter Bid",
                              labelStyle: TextStyle(fontSize: 24)),
                        )))
              ],
            ),
          ),
        ));
  }

输出量