{"id":4273,"date":"2024-11-27T23:27:21","date_gmt":"2024-11-27T23:27:21","guid":{"rendered":"https:\/\/www.qworqs.com\/blog\/?p=4273"},"modified":"2024-11-28T14:23:14","modified_gmt":"2024-11-28T14:23:14","slug":"button-types-in-flutter","status":"publish","type":"post","link":"https:\/\/www.voodoo.business\/blog\/2024\/11\/27\/button-types-in-flutter\/","title":{"rendered":"Button types in flutter"},"content":{"rendered":"\n<p>It should be button shapes or designs, since buttons in flutter all basically work the same way, except for DropDownButton, it is a bit different !<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>ElevatedButton<\/li>\n\n\n\n<li>TextButton<\/li>\n\n\n\n<li>IconButton: An icon is added to your text button !<\/li>\n\n\n\n<li>FloatingActionButton: a circular icon button that hovers over content to promote a primary action in the application. (<a href=\"https:\/\/www.youtube.com\/watch?v=2uaoEDOgk_I\">official Youtube<\/a>)<\/li>\n\n\n\n<li>OutlinedButton: a TextButton with an outlined border<\/li>\n\n\n\n<li>DropDownButton: Allow the user to select from a list of values ! (<a href=\"https:\/\/www.youtube.com\/watch?v=ZzQ_PWrFihg\">Official Youtube<\/a>)<\/li>\n\n\n\n<li>CupertinoButton: A button in iOS style !<\/li>\n<\/ul>\n\n\n\n<p>ButtonStyle IS DEPRECATED !, use WidgetStateProperty (Just replace this class name with that) to set (backgroundColor and foregroundColor) , everything else is identical&#8230;. <\/p>\n\n\n\n<h3 class=\"wp-block-heading\">ButtonStyle Class<\/h3>\n\n\n\n<pre class=\"wp-block-preformatted\">style: ButtonStyle(<br>backgroundColor:<br>  MaterialStateProperty.all&lt;Color&gt;(Colors.green),<br>foregroundColor:<br>  MaterialStateProperty.all&lt;Color&gt;(Colors.white),<br>),<\/pre>\n\n\n\n<p>Instead, use<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">style: ButtonStyle(<br>  backgroundColor:<br>    WidgetStateProperty.all&lt;Color&gt;(Colors.green),<br>  foregroundColor:<br>    WidgetStateProperty.all&lt;Color&gt;(Colors.white),<br>),<\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">styleFrom() method<\/h3>\n\n\n\n<pre class=\"wp-block-preformatted\">ElevatedButton(<br>  style: ElevatedButton.styleFrom(<br>    backgroundColor: Colors.green,<br>    foregroundColor: Colors.white,<br>    textStyle:<br>    TextStyle(fontSize: 20, fontWeight: FontWeight.bold),<br>    padding: EdgeInsets.symmetric(horizontal: 12, vertical: 8),<br>    shape: RoundedRectangleBorder(<br>    borderRadius: BorderRadius.circular(10)),<br>  ),<br>)<\/pre>\n","protected":false},"excerpt":{"rendered":"<p>It should be button shapes or designs, since buttons in flutter all basically work the same way, except for DropDownButton, it is a bit different ! ButtonStyle IS DEPRECATED !, use WidgetStateProperty (Just replace this class name with that) to set (backgroundColor and foregroundColor) , everything else is identical&#8230;. ButtonStyle Class style: ButtonStyle(backgroundColor: MaterialStateProperty.all&lt;Color&gt;(Colors.green),foregroundColor: MaterialStateProperty.all&lt;Color&gt;(Colors.white),), [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[203,160],"tags":[],"class_list":["post-4273","post","type-post","status-publish","format-standard","hentry","category-dart-flutter","category-software-development"],"_links":{"self":[{"href":"https:\/\/www.voodoo.business\/blog\/wp-json\/wp\/v2\/posts\/4273","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.voodoo.business\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.voodoo.business\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.voodoo.business\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.voodoo.business\/blog\/wp-json\/wp\/v2\/comments?post=4273"}],"version-history":[{"count":18,"href":"https:\/\/www.voodoo.business\/blog\/wp-json\/wp\/v2\/posts\/4273\/revisions"}],"predecessor-version":[{"id":4312,"href":"https:\/\/www.voodoo.business\/blog\/wp-json\/wp\/v2\/posts\/4273\/revisions\/4312"}],"wp:attachment":[{"href":"https:\/\/www.voodoo.business\/blog\/wp-json\/wp\/v2\/media?parent=4273"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.voodoo.business\/blog\/wp-json\/wp\/v2\/categories?post=4273"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.voodoo.business\/blog\/wp-json\/wp\/v2\/tags?post=4273"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}