{"id":17419,"date":"2020-08-18T11:34:53","date_gmt":"2020-08-18T11:34:53","guid":{"rendered":"https:\/\/www.devopsschool.com\/blog\/?p=17419"},"modified":"2022-04-13T15:58:35","modified_gmt":"2022-04-13T15:58:35","slug":"how-to-add-text-widget-in-flutter-using-dart-packages","status":"publish","type":"post","link":"https:\/\/www.devopsschool.com\/blog\/how-to-add-text-widget-in-flutter-using-dart-packages\/","title":{"rendered":"How to add text Widget in flutter using Dart Packages?"},"content":{"rendered":"\n<p>In this blog, I am going to adding <strong>text Widget<\/strong> in Mobile App in flutter using <strong>Dart Packages<\/strong>. So, I am using VS Code Editor for easy and fast before creating a Project and open &#8220;<strong>main.dart<\/strong>&#8221; in editor and import-<\/p>\n\n\n\n<p><strong>import &#8220;package:flutter\/material.dart&#8221;;<\/strong><\/p>\n\n\n\n<p>Here, in flutter all screen to called widget like text, button, body. And I to explain the text widget. So, before run App create an app named &#8220;myapp&#8221;. After that, I am using StatelessWidget and create title name, theme color, home, body and using Scaffold method for text and create child and write text in &#8220;Text&#8221; and for a design using style &#8211;<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-1\" data-shcb-language-name=\"CSS\" data-shcb-language-slug=\"css\"><span><code class=\"hljs language-css\">    <span class=\"hljs-selector-tag\">color<\/span>: <span class=\"hljs-selector-tag\">Colors<\/span><span class=\"hljs-selector-class\">.red<\/span>,\n    <span class=\"hljs-selector-tag\">fontStyle<\/span>: <span class=\"hljs-selector-tag\">FontStyle<\/span><span class=\"hljs-selector-class\">.italic<\/span>,\n    <span class=\"hljs-selector-tag\">fontWeight<\/span>: <span class=\"hljs-selector-tag\">FontWeight<\/span><span class=\"hljs-selector-class\">.bold<\/span>,\n    <span class=\"hljs-selector-tag\">fontSize<\/span>: 30,\n    <span class=\"hljs-selector-tag\">backgroundColor<\/span>: <span class=\"hljs-selector-tag\">Colors<\/span><span class=\"hljs-selector-class\">.yellow<\/span>,\n    <span class=\"hljs-selector-tag\">letterSpacing<\/span>: 0<span class=\"hljs-selector-class\">.8<\/span>,\n    <span class=\"hljs-selector-tag\">wordSpacing<\/span>: 1,\n    <span class=\"hljs-selector-tag\">fontFamily<\/span>: \"<span class=\"hljs-selector-tag\">Times<\/span> <span class=\"hljs-selector-tag\">new<\/span> <span class=\"hljs-selector-tag\">Roman<\/span>\",<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-1\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">CSS<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">css<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>Code Mention below-<\/p>\n\n\n\n<script src=\"https:\/\/gist.github.com\/ajcotocus\/911743e3dae2e379ac6346331dcafbcc.js\"><\/script>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/08\/text-in-flutter-485x1024.png\" alt=\"\" class=\"wp-image-17420\" width=\"238\" height=\"502\" srcset=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/08\/text-in-flutter-485x1024.png 485w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/08\/text-in-flutter-142x300.png 142w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/08\/text-in-flutter-768x1621.png 768w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/08\/text-in-flutter-728x1536.png 728w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/08\/text-in-flutter-970x2048.png 970w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/08\/text-in-flutter.png 1080w\" sizes=\"auto, (max-width: 238px) 100vw, 238px\" \/><\/figure><\/div>\n","protected":false},"excerpt":{"rendered":"<p>In this blog, I am going to adding text Widget in Mobile App in flutter using Dart Packages. So, I am using VS Code Editor for easy and fast before&#8230; <\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_joinchat":[],"footnotes":""},"categories":[6331],"tags":[],"class_list":["post-17419","post","type-post","status-publish","format-standard","hentry","category-flutter"],"_links":{"self":[{"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/posts\/17419","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/comments?post=17419"}],"version-history":[{"count":1,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/posts\/17419\/revisions"}],"predecessor-version":[{"id":17421,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/posts\/17419\/revisions\/17421"}],"wp:attachment":[{"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/media?parent=17419"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/categories?post=17419"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/tags?post=17419"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}