Flutter最新计数器例子,Raisebutton已经过时,推荐使用ElevatedButton

2022年7月10日 794点热度 0人点赞 0条评论

先上图:
Flutter最新计数器例子,Raisebutton已经过时,推荐使用ElevatedButton插图

<code>import &#039;package:flutter/material.dart&#039;;

main(){
  runApp(const MyApp());
}
class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      debugShowCheckedModeBanner: false,
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  const MyHomePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text(&quot;计数器&quot;),
        centerTitle: true,
      ),
      body: const MyHomeContent(),
    );
  }
}

class MyHomeContent extends StatefulWidget {
  final String parentValue = &quot;这是父类传过来的值&quot;;
  const MyHomeContent({Key? key}) : super(key: key);
  @override
  State&lt;MyHomeContent&gt; createState() =&gt; _MyHomeContentState();
}

class _MyHomeContentState extends State&lt;MyHomeContent&gt; {
  int _count = 0;
  @override
  Widget build(BuildContext context) {
    return Center(
       child: Column(
         mainAxisAlignment: MainAxisAlignment.center,
         children: &lt;Widget&gt;[
           Row(
             mainAxisAlignment: MainAxisAlignment.center,
             children: &lt;Widget&gt;[
               ElevatedButton(
                   child: const Text(&quot;+&quot;,style:TextStyle(color: Colors.white,fontSize: 35)),
                   onPressed: (){
                     setState(() {
                       _count++;
                     });
                   }),
               ElevatedButton(
                   child: const Text(&quot;-&quot;,style:TextStyle(color: Colors.white,fontSize: 35)),
                   onPressed: (){
                      setState(() {
                        _count--;
                      });
                   }),
             ],
           ),
           Text(&quot;当前计数是:$_count&quot;,style: const TextStyle(fontSize: 30)),
           Text(widget.parentValue,style: const TextStyle(fontSize: 20)),
         ],
       ),
    );
  }
}</code>

例子2:
效果图:
Flutter最新计数器例子,Raisebutton已经过时,推荐使用ElevatedButton插图1

代码:

<code>import &#039;package:flutter/material.dart&#039;;

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

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  const MyHomePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
       title: const Text(&quot;2222&quot;),
        centerTitle: true,
      ),
      body: const MyHomeContent(),
    );
  }
}

class MyHomeContent extends StatefulWidget {
  const MyHomeContent({Key? key}) : super(key: key);

  @override
  State&lt;MyHomeContent&gt; createState() =&gt; _MyHomeContentState();
}

class _MyHomeContentState extends State&lt;MyHomeContent&gt; {
  final ButtonStyle style =
  ElevatedButton.styleFrom(textStyle: const TextStyle(fontSize: 20));

  @override
  Widget build(BuildContext context) {
    return Center(
      child: Column(
        mainAxisSize: MainAxisSize.min,
        children: &lt;Widget&gt;[
           ButtonTheme(
             materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
             child: ElevatedButton(
               style: style,
              onPressed:null,
              child: const Text(&quot;Disabled&quot;),
          ),
           ),
          //const SizedBox(height: 30),
          ElevatedButton(
            style: style,
            onPressed: () {},
            child: const Text(&#039;Enabled&#039;),
          ),
        ],
      ),
    );
  }
}</code>

小小调酒师

此刻打盹,你将做梦; 此刻学习,你将圆梦。 个人邮箱:shellways@foxmail.com

文章评论