5

最近では、Android プラットフォーム用の flutter モバイル アプリケーションを開発しています。アイコン/画像にテキストを含むボタンを追加したい。その画像は、ボタン テキストの右側にある必要があります。

私はすでにここに画像を添付しました。

ここに画像の説明を入力

これは私のコードです。

child: FlatButton.icon(
     icon: Image.asset("images/notesicon.png", width: 20.0,height: 20.0,),
     label: Text("Add Note",
        style: TextStyle(
           fontSize: 11.0,
           fontFamily: "Raleway"
        ),
     ),
     textColor: Colors.white,
     color: Color(0xFF226597),
     shape: OutlineInputBorder(borderSide: BorderSide(
               style: BorderStyle.solid,
               width: 1.0,
               color: Colors.black),
            borderRadius: new BorderRadius.circular(20.0)
      ),
    ),
4

8 に答える 8

8

以下のコードを試してください:

FlatButton(
   padding: EdgeInsets.all(10.0),
   child: Row(
   children: < Widget > [
     Text("Make a Note"),
     Icon(Icons.note),
   ],
 ),
)
于 2019-05-31T06:07:26.090 に答える
1
child: FlatButton.icon(
 icon:  Text("Add Note",
    style: TextStyle(
       fontSize: 11.0,
       fontFamily: "Raleway"
    ),
 ),
 label: Image.asset("images/notesicon.png", width: 20.0,height: 20.0,),
 textColor: Colors.white,
 color: Color(0xFF226597),
 shape: OutlineInputBorder(borderSide: BorderSide(
           style: BorderStyle.solid,
           width: 1.0,
           color: Colors.black),
        borderRadius: new BorderRadius.circular(20.0)
  ),
),
于 2021-01-05T14:20:13.877 に答える
0

このウィジェットを使用して、アクション付きの独立したボタンを作成できます。いくつかの必要な UI の変更。

      Widget btnChooseFromDevice() {
        return Container(
          height: 56.0,
          width: MediaQuery.of(context).size.width,
          child: FlatButton(
            child: Row(
              children: <Widget>[
                SizedBox(width: 20.0,),
                Text(
                  'Choose from Device',
                  style: TextStyle(
                    fontSize: 20.0,
                    fontFamily: 'Righteous',
                    fontWeight: FontWeight.bold,
                  ),
                 Container(
                  width: 36,
                  height: 36,
                  child: Image.asset("assets/images/file.png"),
                ),
                ),

              ],
            ),
            textColor: Colors.white,
            shape:
            RoundedRectangleBorder(borderRadius: BorderRadius.circular(30.0)),
            onPressed: () {
              print('button pressed');
    //          getImage();
            },
          ),
        );
      }
于 2020-01-24T10:17:46.913 に答える