dart 如何使这样的柜台按钮在跳动

ylamdve6  于 2023-07-31  发布在  其他
关注(0)|答案(2)|浏览(82)

我想要一个扑计数按钮在右边,如图所示


的数据

qxsslcnc

qxsslcnc1#

在未来发布问题时,请始终显示您所做的以及您希望他人如何改进您的代码。不要让别人做你的工作。
查看以下代码:

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        backgroundColor: Colors.red,
        body: Center(
          child: Home(),
        ),
      ),
    );
  }
}

class Home extends StatefulWidget {
  int counter = 0;

  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {

  @override
  Widget build(BuildContext context) {
  
    return Container(
            decoration: BoxDecoration(
              borderRadius: BorderRadius.circular(10),
              color: Colors.green,
            ),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                GestureDetector(
                  onTap: () => setState(() {
                           widget.counter == 0 ? print('counter at 0') : widget.counter--;
                        }),
                    child: Icon(Icons.remove)),
                Text('${widget.counter}'),
                GestureDetector(
                  onTap: () {setState(() {
                    print('set');
                            widget.counter++;
                        });},
                    child: Icon(Icons.add)),

              ],
            ),);
  }
}

字符串
根据自己的需要更改父容器的宽度或添加填充。

qyswt5oh

qyswt5oh2#

Container(   decoration: BoxDecoration(
    borderRadius: BorderRadius.circular(35),
    color: Colors.green,   ),   child: Row(
    mainAxisSize: MainAxisSize.min,
    children: const [
      Padding(
        padding: EdgeInsets.all(8.0),
        child: Icon(
          Icons.add,
          color: Colors.white,
        ),
      ),
      Text('1', style: TextStyle(color: Colors.white),),
      Padding(
        padding: EdgeInsets.all(8.0),
        child: Icon(
          Icons.add,
          color: Colors.white,
        ),
      ),
    ],   ), )

字符串
请试试这个。希望对你有帮助:)

相关问题