簡體   English   中英

Flutter UI - 行和列

[英]Flutter UI - Row and Column

任何人都可以幫我創建這個用戶界面。 我整天都在嘗試創建這個,但我無法編碼。

這是設計——

在此處輸入圖片說明

請根據需要調整顏色和其他在此處輸入圖片說明

代碼在這里

Padding(
        padding: const EdgeInsets.all(8.0),
        child: Card(
          color: Colors.green,
          elevation: 16,
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(10),
          ),
          child: Wrap(
            children: [
              Container(
                width: MediaQuery.of(context).size.width,
                decoration: BoxDecoration(
                    color: Colors.white,
                    borderRadius: BorderRadius.only(
                        bottomRight: Radius.circular(10),
                        topRight: Radius.circular(10))),
                margin: EdgeInsets.only(left: 10),
                padding: EdgeInsets.symmetric(horizontal: 16, vertical: 10),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Text(
                      "Dr. Alok Verma",
                      style: TextStyle(fontSize: 24),
                    ),
                    SizedBox(
                      height: 10,
                    ),
                    Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        Expanded(
                            child: Text("Date: 14-06-2021",
                                style: TextStyle(fontSize: 24))),
                        Expanded(
                            child: FlatButton(
                                onPressed: () {},
                                child: Container(
                                    decoration: BoxDecoration(
                                        color: Colors.green,
                                        borderRadius: BorderRadius.circular(5)),
                                    padding: EdgeInsets.all(8),
                                    child: Text("Completed",
                                        style: TextStyle(fontSize: 24)))))
                      ],
                    ),
                    Text("Time: 10:20", style: TextStyle(fontSize: 24)),
                    SizedBox(
                      height: 20,
                    ),
                    Text("Aastha Hospital",
                        style: TextStyle(
                            fontSize: 24, fontWeight: FontWeight.bold)),
                    Text("Some address", style: TextStyle(fontSize: 18)),
                  ],
                ),
              )
            ],
          ),
        ),
      )

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM