{"id":916,"date":"2020-09-07T09:00:02","date_gmt":"2020-09-07T00:00:02","guid":{"rendered":"http:\/\/mobilelab.khu.ac.kr\/?p=916"},"modified":"2020-04-05T19:09:52","modified_gmt":"2020-04-05T10:09:52","slug":"be-dart-programmer-34","status":"publish","type":"post","link":"http:\/\/mobilelab.khu.ac.kr\/wordpress\/2020\/09\/07\/be-dart-programmer-34\/","title":{"rendered":"Dart Programmer \ub418\uae30 [34]"},"content":{"rendered":"\n<h4>&lt; Flutter \ud65c\uc6a9\ud558\uae30 &#8211; StatefulWidgets Example &gt; <\/h4>\n\n\n\n<p>\uc55e\uc758 \uae00\uc5d0\uc11c \uc791\uc131\ud55c StatelessWidget class \uae30\ubc18 \uc571\uc744 \uc218\uc815\ud558\uc5ec, \uc0ac\uc6a9\uc790\uc640 \ub3d9\uc801\uc778 \ubc18\uc751\uc744 \ud558\uba74\uc11c \uc0ac\uc6a9\uc790 \uc778\ud130\ud398\uc774\uc2a4\uac00 \ubcc0\uacbd\ub418\ub294 \ud615\ud0dc\ub85c \ubc14\uafb8\uace0\uc790 \ud569\ub2c8\ub2e4. \uc989, StatefulWidget class \uac1c\ub150\uc744 \ucd94\uac00\ud558\uc5ec \uc55e\uc11c\uc5d0\uc11c\uc758 darttutorial-33-01.dart\ub97c \uc218\uc815 \ud569\ub2c8\ub2e4.<\/p>\n\n\n\n<h4>Goals of Modification<\/h4>\n\n\n\n<p>\ud504\ub85c\uadf8\ub7a8\uc758 \uc218\uc815 \ubaa9\ud45c\ub294 \ub2e8\uc21c \ud569\ub2c8\ub2e4. \uc544\ub798\uc758 [\uadf8\ub9bc1]\uacfc \uac19\uc774 \uc791\uc131\ud55c \uc55e\uc11c \uae00\uc758 \ud504\ub85c\uadf8\ub7a8\uc5d0\uc11c, \ubcc4\ud45c\ub97c \ud074\ub9ad\ud558\uba74, [\uadf8\ub9bc2]\uc640 \uac19\uc774 \ub418\ub294 \uac83\uc785\ub2c8\ub2e4. \uc989, 1) \ubd89\uc740\uc0c9\uc778 \ubcc4\ubaa8\uc591\uc744 \uac80\uc740\uc0c9\uc73c\ub85c \ubc14\uafc9\ub2c8\ub2e4. 2) \ubcc4\ud45c \uc606\uc758 \uc22b\uc790\ub97c 1\ub9cc\ud07c \uac10\uc18c \uc2dc\ud0b5\ub2c8\ub2e4. <\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" loading=\"lazy\" width=\"426\" height=\"734\" src=\"http:\/\/mobilelab.khu.ac.kr\/wordpress\/wp-content\/uploads\/2020\/04\/\u1109\u1173\u110f\u1173\u1105\u1175\u11ab\u1109\u1163\u11ba-2020-02-20-\u110b\u1169\u1112\u116e-5.12.48.png\" alt=\"\" class=\"wp-image-918\" srcset=\"http:\/\/mobilelab.khu.ac.kr\/wordpress\/wp-content\/uploads\/2020\/04\/\u1109\u1173\u110f\u1173\u1105\u1175\u11ab\u1109\u1163\u11ba-2020-02-20-\u110b\u1169\u1112\u116e-5.12.48.png 426w, http:\/\/mobilelab.khu.ac.kr\/wordpress\/wp-content\/uploads\/2020\/04\/\u1109\u1173\u110f\u1173\u1105\u1175\u11ab\u1109\u1163\u11ba-2020-02-20-\u110b\u1169\u1112\u116e-5.12.48-174x300.png 174w\" sizes=\"(max-width: 426px) 100vw, 426px\" \/><figcaption>[\uadf8\ub9bc1] &#8220;\uc88b\uc544\uc694&#8221; \ud65c\uc131\ud654 \uc0c1\ud0dc (\ubcc4 \ubaa8\uc591 \uc544\uc774\ucf58\uc774 \ubd89\uc740\uc0c9)<\/figcaption><\/figure><\/div>\n\n\n\n<p>\ub9cc\uc57d \ubcc4\uc774 \uac80\uc740\uc0c9\uc778 \uc0c1\ud0dc\uc5d0\uc11c \ub2e4\uc2dc \ud074\ub9ad\uc744 \ud558\uba74, 1) \uac80\uc740\uc0c9\uc758 \ubcc4\ubaa8\uc591\uc744 \ubd89\uc740\uc0c9\uc73c\ub85c \ubc14\uafc9\ub2c8\ub2e4. 2) \ubcc4\ud45c \uc606\uc758 \uc22b\uc790\ub97c 1\ub9cc\ud07c \uc99d\uac00 \uc2dc\ud0b5\ub2c8\ub2e4. \uc989, \ub204\ub97c\ub54c \ub9c8\ub2e4 \ubc18\uc804(reverse) \uc791\uc5c5\uc744 \uc218\ud589\ud558\ub294 \ub2e8\uc21c\ud55c \uc791\uc5c5\uc744 \ud558\ub3c4\ub85d \uac1c\uc120 \ud569\ub2c8\ub2e4.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" loading=\"lazy\" width=\"426\" height=\"734\" src=\"http:\/\/mobilelab.khu.ac.kr\/wordpress\/wp-content\/uploads\/2020\/04\/\u1109\u1173\u110f\u1173\u1105\u1175\u11ab\u1109\u1163\u11ba-2020-02-20-\u110b\u1169\u1112\u116e-5.12.54.png\" alt=\"\" class=\"wp-image-919\" srcset=\"http:\/\/mobilelab.khu.ac.kr\/wordpress\/wp-content\/uploads\/2020\/04\/\u1109\u1173\u110f\u1173\u1105\u1175\u11ab\u1109\u1163\u11ba-2020-02-20-\u110b\u1169\u1112\u116e-5.12.54.png 426w, http:\/\/mobilelab.khu.ac.kr\/wordpress\/wp-content\/uploads\/2020\/04\/\u1109\u1173\u110f\u1173\u1105\u1175\u11ab\u1109\u1163\u11ba-2020-02-20-\u110b\u1169\u1112\u116e-5.12.54-174x300.png 174w\" sizes=\"(max-width: 426px) 100vw, 426px\" \/><figcaption>[\uadf8\ub9bc2] &#8220;\uc88b\uc544\uc694&#8221; \ube44\ud65c\uc131\ud654 \uc0c1\ud0dc (\ubcc4 \ubaa8\uc591 \uc544\uc774\ucf58\uc774 \uac80\uc815\uc0c9)<\/figcaption><\/figure><\/div>\n\n\n\n<h4>Code Modification using StatefulWidget<\/h4>\n\n\n\n<p>\uc544\ub798\uc758 darttutorial-34-01.dart \ud504\ub85c\uadf8\ub7a8\uc774 \uc218\uc815\ud55c main.dart \ud504\ub85c\uadf8\ub7a8 \uc785\ub2c8\ub2e4. \ud504\ub85c\uadf8\ub7a8\uc758 \uc218\uc815\uc740 \ud06c\uac8c 2 \ubd80\ubd84\uc5d0 \ub300\ud574\uc11c \uc774\ub8e8\uc5b4 \uc9d1\ub2c8\ub2e4. \uccab\uc9f8\ub294 \uc18c\uc2a4 \ucf54\ub4dc\uc5d0\uc11c &#8220;OLD&#8221;\ub85c \ud45c\uae30\ud558\uc5ec \uc8fc\uc11d \ucc98\ub9ac\ud55c \ubd80\ubd84 \ub300\uc2e0 &#8220;New #1&#8243;\uc73c\ub85c \ubc14\ub010 \ubd80\ubd84\uc785\ub2c8\ub2e4. \ub458\uc9f8\ub294 &#8220;New #2&#8243;\ub85c \ud45c\uc2dc\ud55c, \ud504\ub85c\uadf8\ub7a8\uc758 \ud6c4\ubc18\ubd80\uc5d0 \ucd94\uac00\ud55c \uc0ac\ud56d\uc785\ub2c8\ub2e4.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">\/\/ darttutorial-34-01.dart\n\/\/ Based on : https:\/\/flutter.dev\/docs\/development\/ui\/layout\n\nimport 'package:flutter\/material.dart';\nimport 'package:flutter\/semantics.dart';\n\nvoid main() {\n  var parameter = {\n    'appBarTitle': 'Flutter Layout Demo Program',\n    'titleImage': 'images\/lake.jpg',\n    'titleSectionHeader': '\uacbd\ud76c\ub300\ud559\uad50 \uad6d\uc81c\ucea0\ud37c\uc2a4',\n    'titleSectionBody': '\uacbd\uae30\ub3c4 \uc6a9\uc778\uc2dc \uae30\ud765\uad6c \ub355\uc601\ub300\ub85c 1732\ubc88\uc9c0',\n    'titleSectionScore': 22,\n    'textSection': '\uad6d\uc81c\ucea0\ud37c\uc2a4\ub294 \uacf5\ud559, \uc751\uc6a9\uacfc\ud559, \uc0dd\uba85\uacfc\ud559, \uc804\uc790\uc815\ubcf4, \uc18c\ud504\ud2b8\uc6e8\uc5b4, \uc2e4\uc6a9\uc608\uc220, \uad6d\uc81c\ud559, '\n        '\uc678\uad6d\uc5b4, \uccb4\uc721 \uc911\uc2ec\uc758 \ucea0\ud37c\uc2a4\ub85c, \ud2b9\uc131 \uc788\ub294 \ud559\ubb38\ubd84\uc57c\uac00 \ub9ce\uc2b5\ub2c8\ub2e4. '\n        '\uc8fc\uc694 \uc2dc\uc124\ub85c\ub294 \uc218\uc6a9 \uc778\uc6d0 8\ucc9c\uc5ec\uba85 \uaddc\ubaa8\uc758 \ub178\ucc9c\uadf9\uc7a5 \ubc0f \uc885\ud569\uccb4\uc721\uad00, \ucc9c\ubb38\ub300, \uc6d0\uc790\ub85c\uc2e4 \ub4f1\uc774 \uc788\uc2b5\ub2c8\ub2e4. '\n        '\uacbd\ud76c\ub300\ub294 \uad6d\uc81c\ucea0\ud37c\uc2a4\ub97c \ud3ec\ud568\ud558\uc5ec \uc11c\uc6b8\ucea0\ud37c\uc2a4, \uad11\ub984\ucea0\ud37c\uc2a4\ub97c \ubcf4\uc720\ud558\uace0 \uc788\uc2b5\ub2c8\ub2e4. '\n        '\uad50\uba85\uc778 \uacbd\ud76c\ub300(\u6176\u7199\u5927)\ub294 \uc601\uc815\uc870 \uc2dc\ub300\uc758 \uce58\uc138\uac00 \ud3bc\uccd0\uc9c4 \uc870\uc120\uc2dc\ub300\uc758 \uc815\uad81 \uacbd\ud76c\uad81(\u6176\u7199\u5bae)\uc5d0\uc11c \ub530\uc628 \uac83\uc73c\ub85c, '\n        '\uc784\uc9c4\uc65c\ub780\uacfc \ubcd1\uc790\ud638\ub780\uc758 \ud3d0\ud5c8\ub97c \ub51b\uace0 \ubb38\uc608\ub97c \ubd80\ud765\uc2dc\ud0a8 \uc870\uc120 \ud6c4\uae30 \uc601\uc815\uc870 \uc2dc\ub300\ucc98\ub7fc, '\n        '\ud55c\uad6d \uc804\uc7c1\uc73c\ub85c \ud53c\ud3d0\ud574\uc9c4 \uc774 \ub545\uc5d0 \ub2e4\uc2dc \ubb38\ud654\uc801\uc778 \ub974\ub124\uc0c1\uc2a4\uac00 \uc624\uae30\ub97c \ubc14\ub77c\ub294 \ub9c8\uc74c\uc73c\ub85c '\n        '\uacbd\ud76c\ud559\uc6d0(\uace0\ud669\uc7ac\ub2e8)\uc758 \uc124\ub9bd\uc790\uc778 \uc870\uc601\uc2dd\uc5d0 \uc758\ud574 \uba85\uba85\ub418\uc5c8\uc2b5\ub2c8\ub2e4.',\n  };\n\n  runApp(MyApp(parameter));\n}\n\nclass MyApp extends StatelessWidget {\n  \/\/ Constructor with a Map type input parameter.\n  MyApp(this.internalStorage);\n\n  \/\/ Internal storage to save a page content which initialized by constructor.\n  final Map internalStorage;\n\n  \/\/ build method.\n  @override\n  Widget build(BuildContext context) {\n    Widget titleImage = _buildTitleImage(internalStorage['titleImage']);\n\n    Widget titleSection = _buildTitleSection(\n        internalStorage['titleSectionHeader'],\n        internalStorage['titleSectionBody'],\n        internalStorage['titleSectionScore']);\n\n    Widget buttonSection = _buildButtonSection(Theme.of(context).primaryColor);\n\n    String textSectionMessage = internalStorage['textSection'];\n\n    Widget textSection = _buildTextSection(textSectionMessage);\n\n    return MaterialApp(\n      title: internalStorage['appBarTitle'],\n      home: Scaffold(\n        appBar: AppBar(\n          title: Text(internalStorage['appBarTitle']),\n        ),\n        body: ListView(\n          children: [\n            titleImage,\n            titleSection,\n            buttonSection,\n            textSection,\n          ],\n        ),\n      ),\n    );\n  }\n\n  \/\/ Build function to create title image Widget\n  dynamic _buildTitleImage(String imageName) {\n    return Image.asset(\n      imageName,\n      width: 600,\n      height: 240,\n      fit: BoxFit.cover,\n    );\n  }\n\n  \/\/ Build function to create title section Widget\n  Container _buildTitleSection(String name, String addr, int count) {\n    return Container(\n      padding: const EdgeInsets.all(32),\n      child: Row(\n        children: [\n          Expanded(\n            child: Column(\n              crossAxisAlignment: CrossAxisAlignment.start,\n              children: [\n                Container(\n                  padding: const EdgeInsets.only(bottom: 8),\n                  child: Text(\n                    name,\n                    style: TextStyle(\n                      fontWeight: FontWeight.bold,\n                    ),\n                  ),\n                ),\n                Text(\n                  addr,\n                  style: TextStyle(\n                    color: Colors.grey[500],\n                  ),\n                ),\n              ],\n            ),\n          ),\n\/* OLD    \n          Container(\n            child: Row(\n              children: [\n                Icon(\n                  Icons.star,\n                  color: Colors.red[500],\n                ),\n                Text('$count'),\n              ],\n            ),\n          ),\n *\/\n\/\/ New #1 : Start\n          Counter(count),\n\/\/ New #1 : End\n        ],\n      ),\n    );\n  }\n\n  \/\/ Build function to create button section Widget\n  Container _buildButtonSection(Color color) {\n    return Container(\n      child: Row(\n        mainAxisAlignment: MainAxisAlignment.spaceEvenly,\n        children: [\n          _buildButtonColumn(color, Icons.call, '\uc804\ud654'),\n          _buildButtonColumn(color, Icons.near_me, '\uacbd\ub85c'),\n          _buildButtonColumn(color, Icons.share, '\uacf5\uc720'),\n        ],\n      ),\n    );\n  }\n\n  \/\/ Build function to create button with icon and sub-title for _buildButtonSection()\n  Column _buildButtonColumn(Color color, IconData icon, String label) {\n    return Column(\n      mainAxisSize: MainAxisSize.min,\n      mainAxisAlignment: MainAxisAlignment.center,\n      children: [\n        Icon(icon, color: color),\n        Container(\n          margin: const EdgeInsets.only(top: 8),\n          child: Text(\n            label,\n            style: TextStyle(\n              fontSize: 13,\n              fontWeight: FontWeight.w400,\n              color: color,\n            ),\n          ),\n        ),\n      ],\n    );\n  }\n\n  \/\/ Build function to create text description section Widget\n  Container _buildTextSection(String section) {\n    return Container(\n      padding: const EdgeInsets.all(32),\n      child: Text(\n        section,\n        softWrap: true,\n      ),\n    );\n  }\n}\n\n\/\/ New #2 : Start\n\nclass Counter extends StatefulWidget {\n  final _counter;\n\n  Counter(this._counter) {\n  }\n\n  @override\n  _CounterState createState() =&gt; _CounterState(_counter);\n}\n\nclass _CounterState extends State&lt;Counter&gt; {\n  int _counter;\n  bool _boolStatus = true;\n  Color _statusColor = Colors.black;\n\n  _CounterState(var counterValue) {\n    _counter = counterValue;\n  }\n\n  void _buttnPressed() {\n    setState(() {\n      if(_boolStatus == true) {\n        _boolStatus = false;\n        _counter--;\n        _statusColor = Colors.black;\n      } else {\n        _boolStatus = true;\n        _counter++;\n        _statusColor = Colors.red;\n      }\n    });\n  }\n\n  @override\n  Widget build(BuildContext context) {\n    return Container(\n      child: Row(\n        children: [\n          IconButton(\n            icon: Icon(Icons.star),\n            color: _statusColor,\n            onPressed: _buttnPressed,\n          ),\n          Text('$_counter'),\n        ],\n      ),\n    );\n  }\n}\n\n\/\/ New #2 : End<\/pre>\n\n\n\n<p>\uc218\uc815\uc0ac\ud56d #1\uc740 \uc55e\uc11c darttutorial-33-01.dart\uc5d0\uc11c \uace0\uc815\uc801\uc778 \ud615\ud0dc\ub85c \ub9cc\ub4e0 \ubd89\uc740\uc0c9 \ubcc4\ud45c \uc544\uc774\ucf58\uacfc \uace0\uc815\ub41c count \uac12\uc744, count \uac12\uc744 constructor\uc758 \uc785\ub825 \ud30c\ub77c\uba54\ud0c0\ub85c \ub300\uccb4\ud55c Counter class\uc758 \uac1d\uccb4\ub85c \uad50\uccb4\ud55c \uac83 \uc785\ub2c8\ub2e4.<\/p>\n\n\n\n<p>\uc218\uc815\uc0ac\ud56d #2\ub294 \uc774\uc81c \uc815\uc801\uc778 \ubcc4\ubaa8\uc591\uacfc count \uac12\uc774, \ub3d9\uc801\uc73c\ub85c \ubcc0\uacbd\ub420 \uac83\uc774\ub2c8, \uc774\ub97c \uc800\uc7a5\ud558\uace0 \uad00\ub9ac\ud560 StatefulWidget\uacfc \uc774 widget\uc774 \ub2e4\ub8f0 State&lt;&gt; class\ub97c \ub9cc\ub4dc\ub294 \uc791\uc5c5\uc785\ub2c8\ub2e4. \uba3c\uc800, \uc55e\uc11c #1\uc5d0\uc11c \uc81c\uac70\ud55c \ubaa8\uc591\uc744 \ub300\uccb4\ud558\ub294 \ubaa8\uc591\uc774 _CounterState class \uc548\uc758 build() \uc18d\uc5d0 \ud3ec\ud568\ub41c \uac83\uc744 \ubcfc \uc218 \uc788\uc2b5\ub2c8\ub2e4. build() \ud568\uc218\uc758 \uae30\ub2a5\uc740 \uc774\ubbf8 \uc5ec\ub7ec\ubc88 \uc5b8\uae09\uc774 \ub418\uc5c8\ub4ef\uc774, \ud654\uba74\uc5d0 \uc0ac\uc6a9\uc790 \uc778\ud130\ud398\uc774\uc2a4\ub97c \ud45c\uc2dc\ud558\ub294 \uc5ed\ud560\uc744 \ud569\ub2c8\ub2e4. \uc774 \ud568\uc218\uac00 \ub9ac\ud134\ud558\ub294 Container() \uac1d\uccb4\uc758 \uad6c\uc131 \uc694\uc18c\ub97c \uc0b4\ud3b4\ubcf4\uba74, \uc55e\uc11c \uc81c\uac70\ud55c \uace0\uc815 \ud615\ud0dc\uc758 Container()\uc640 \ub3d9\uc77c\ud558\uac8c \ubcc4\ubaa8\uc591 \uc544\uc774\ucf58\uacfc Text\ub85c \uc774\ub8e8\uc5b4\uc9c4 \uac83\uc744 \uc54c\uc218 \uc788\uc2b5\ub2c8\ub2e4. \ub2e8, \uace0\uc815 \ubc29\uc2dd\uc5d0\uc11c\ub294 color\uac00 \ubd89\uc740 \uc0c9\uc73c\ub85c \uace0\uc815\ub418\uc5c8\uc73c\ub098, \uc218\uc815\ud55c \ucf54\ub4dc\uc5d0\uc11c\ub294 stateColor \ubcc0\uc218\uc758 \uac12\uc5d0 \ub530\ub77c \ub2ec\ub77c\uc9c0\ub3c4\ub85d \ud558\uc600\uc2b5\ub2c8\ub2e4. \uace0\uc815 \ubc29\uc2dd\uc5d0\uc11c\ub294 \uc5c6\uc5c8\ub358 onPressed method\ub97c \ucc44\uc6b0\ub294 \ubd80\ubd84\uc774 \uc0dd\uacbc\uc73c\uba70, \uc774\ub294 \ubcc4\ubaa8\uc591\uc744 \ud074\ub9ad\ud558\uba74 buttonPressed() \ud568\uc218\uac00 \ud638\ucd9c\ub418\ub294 \uac83\uc744 \uc758\ubbf8\ud569\ub2c8\ub2e4. \ubcc4 \ubaa8\uc591 \uc606\uc5d0 \uac19\uc740 Row\ub85c \ud45c\uc2dc\ub418\ub294 \uae00\uc790\ub294 \ub9c8\ucc2c\uac00\uc9c0\ub85c counter\ub77c\ub294 \ubcc0\uc218 \uac12\uc744 \ud45c\uc2dc\ud558\ub3c4\ub85d \ub418\uc5b4 \uc788\uc2b5\ub2c8\ub2e4. <\/p>\n\n\n\n<p>\uc0c8\ub85c \ub4f1\uc7a5\ud55c \uc0ac\ud56d\uc744 \ud655\uc778\ud574 \ubcf4\uba74, \uba3c\uc800 statusColor\ub294 CounterState class\uc758 property\ub85c \ub9cc\ub4e4\uc5b4\uc838 \uc788\ub294 \uac83\uc744 \ubcfc \uc218 \uc788\uc2b5\ub2c8\ub2e4. \ub2e4\uc74c\uc73c\ub85c buttnPressed() method\uac00 CounterState class \uc548\uc5d0 \uc815\uc758\ub418\uc5b4 \uc788\ub294 \uac83\uc744 \ubcfc\uc218 \uc788\uc2b5\ub2c8\ub2e4. \uc5ec\uae30\uc11c, buttnPressed() \uc548\uc744 \ubcf4\uba74, build() \ud568\uc218\ub97c trigger\ud558\uc5ec \ud654\uba74\uc744 \uc5c5\ub370\uc774\ud2b8 \ud558\ub294 setState()\uac00 \uc2e4\ud589\ub418\ub294\ub370, \uc5ec\uae30\uc5d0 \uc804\ub2ec\ud558\ub294 \ud568\uc218\uc758 \uae30\ub2a5\uc744 \uc0b4\ud3b4\ubcf4\uba74, boolStatus \uac12\uc774 true\/false\uc758 \uc774\ubd84\ubc95\uc801\uc778 \uc0c1\ud0dc\uc5d0 \ub9de\ucdb0\uc11c, \ubcc4\ubaa8\uc591\uc758 \uc0c9\uc744 \ubd89\uc740\uc0c9\uacfc \uac80\uc815\uc0c9 \uc0ac\uc774\uc5d0\uc11c \ubcc0\uacbd\ud558\uace0, counter\uc758 \uac12\uc744 1\ub9cc\ud07c \ub298\ub9ac\uac70\ub098 \uc904\uc774\ub294 \uc791\uc5c5\uc744 \ud558\ub294 \uac83\uc744 \uc54c \uc218 \uc788\uc2b5\ub2c8\ub2e4. \ub530\ub77c\uc11c, \ub2e8\ucd94\ub97c \ub20c\ub800\uc744\ub54c \ubaa8\uc591\uacfc \uc22b\uc790\uac00 \ubc14\ub00c\ub294 \uc774\uc720\ub97c \uc774\uc81c \uc774\ud574\ud560 \uc218 \uc788\uc744 \uac81\ub2c8\ub2e4. \ubcc4\ubaa8\uc591 \uc606\uc758 \uc22b\uc790\ub294 \ub2e4\uc74c\uc758 \uc21c\uc11c\ub97c \uac70\uccd0\uc11c CounterState class\uc758 counter \uac12\uc73c\ub85c \uc804\ub2ec\ub429\ub2c8\ub2e4. \uba3c\uc800 MyApp class\uc758 buildTitleSection()\uc774 \uc2e4\ud589\ud558\uba74\uc11c, Counter \uac1d\uccb4\ub97c \ub9cc\ub4e4\uac8c \ub418\uace0, \uc5ec\uae30\uc11c count \uac12\uc744 \ucd08\uae30\ud654 \ud569\ub2c8\ub2e4. \uc774\ub97c \ubc1b\uc740 Counter \ud074\ub798\uc2a4\uc758 \uac1d\uccb4\ub294 \uc790\uc2e0\uc758 property\ub97c \ubc1b\uc740 count \uac12\uc73c\ub85c \ucd08\uae30\ud654 \ud55c \ud6c4, \uad00\ub9ac\ud560 State\uc778 CounterState class \uac1d\uccb4\uc758 \ucd08\uae30\ud654 \uac12\uc73c\ub85c \uc804\ub2ec\ud558\uac8c \ub418\uace0, CounterState class\ub294 \uc774\ub97c \ub0b4\ubd80 property\uc778 counter\uc5d0 \uc800\uc7a5\ud568\uc73c\ub85c, \ud504\ub85c\uadf8\ub7a8 \uc2dc\uc791\uc2dc\uc758 \ucd08\uae30\ud654 \uac12\uc744 \uc804\ub2ec \ubc1b\uac8c \ub429\ub2c8\ub2e4.<\/p>\n\n\n\n<h4>\ub9c8\ubb34\ub9ac<\/h4>\n\n\n\n<p>\uc9c0\uae08\uae4c\uc9c0 Flutter\uc758 StatelessWidget\uacfc StatefulWidget\uc744 \uc774\uc6a9\ud558\uc5ec, \uc815\uc801\uc778 \uc0ac\uc6a9\uc790 \uc778\ud130\ud398\uc774\uc2a4\uc640 \ub3d9\uc801\uc778 \uc0ac\uc6a9\uc790 \uc778\ud130\ud398\uc774\uc2a4\ub97c \uad6c\ud604\ud574 \ubcf4\uc558\uc2b5\ub2c8\ub2e4. \uc9c0\uae08\uae4c\uc9c0 \uc2e4\ud589\ud574 \uc628 \ud504\ub85c\uadf8\ub7a8\ub4e4\uc758 \uc18c\uc2a4 \ucf54\ub4dc\ub97c \uc0b4\ud3b4\ubcf4\uba74 \uc54c\uaca0\uc9c0\ub9cc, Flutter\ub294 \uac04\ub2e8\ud558\uac8c \ub3d9\uc791\ud558\ub294 Widget\ub4e4\uc744 \ud65c\uc6a9\ud558\uc5ec \ub2e8\uc21c\ud55c \ud654\uba74\uc744 \uad6c\uc131\ud558\uac70\ub098, Widget\ub4e4\uc744 \ubcf5\ud569\uc801\uc73c\ub85c \uc0ac\uc6a9\ud558\uc5ec, \ubcf5\uc7a1\ud55c \uae30\ub2a5\uacfc \ud45c\ud604\uc744 \uad6c\ud604\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4. \uc774\ub7ec\ud55c \uc774\uc720\ub85c Flutter\ub97c \uc2dc\uc791\ud560 \ub54c, \ub2e4\uc591\ud55c Reference\ub4e4\uc744 \uba3c\uc800 \uc18c\uac1c\ud558\uc600\uc2b5\ub2c8\ub2e4. \uc5b4\ub5a4 Widget\ub4e4\uc744 Flutter\uac00 \uc9c0\uc6d0\ud558\ub294\uc9c0\uc640 3rd party\ub97c \ud1b5\ud574\uc11c \uc81c\uacf5\ub418\ub294 Widget\ub4e4\uc740 \uc5b4\ub5a4 \uac83\ub4e4\uc774 \uc788\ub294\uc9c0\ub97c \uc774\ud574\ud55c\ub2e4\uba74 \ud504\ub85c\uadf8\ub7a8\uc744 \uac1c\ubc1c\ud558\ub294\ub370 \ud070 \ub3c4\uc6c0\uc774 \ub420 \uac81\ub2c8\ub2e4. <\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"alignright is-resized\"><img decoding=\"async\" loading=\"lazy\" src=\"http:\/\/mobilelab.khu.ac.kr\/wordpress\/wp-content\/uploads\/2020\/01\/b05-1.jpg\" alt=\"\" class=\"wp-image-267\" width=\"137\" height=\"49\"\/><\/figure><\/div>\n\n\n\n<p>Creative Commons License (CC BY-NC-ND)<\/p>\n","protected":false},"excerpt":{"rendered":"<p>&lt; Flutter \ud65c\uc6a9\ud558\uae30 &#8211; StatefulWidgets Example &gt; \uc55e\uc758 \uae00\uc5d0\uc11c \uc791\uc131\ud55c StatelessWidget class \uae30\ubc18 \uc571\uc744 \uc218\uc815\ud558\uc5ec, \uc0ac\uc6a9\uc790\uc640 \ub3d9\uc801\uc778 \ubc18\uc751\uc744 \ud558\uba74\uc11c \uc0ac\uc6a9\uc790 \uc778\ud130\ud398\uc774\uc2a4\uac00 \ubcc0\uacbd\ub418\ub294 \ud615\ud0dc\ub85c \ubc14\uafb8\uace0\uc790 \ud569\ub2c8\ub2e4. \uc989, StatefulWidget class \uac1c\ub150\uc744 \ucd94\uac00\ud558\uc5ec &#8230;<\/p>\n","protected":false},"author":1,"featured_media":990,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"om_disable_all_campaigns":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0},"categories":[3],"tags":[13],"aioseo_notices":[],"_links":{"self":[{"href":"http:\/\/mobilelab.khu.ac.kr\/wordpress\/wp-json\/wp\/v2\/posts\/916"}],"collection":[{"href":"http:\/\/mobilelab.khu.ac.kr\/wordpress\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/mobilelab.khu.ac.kr\/wordpress\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/mobilelab.khu.ac.kr\/wordpress\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/mobilelab.khu.ac.kr\/wordpress\/wp-json\/wp\/v2\/comments?post=916"}],"version-history":[{"count":5,"href":"http:\/\/mobilelab.khu.ac.kr\/wordpress\/wp-json\/wp\/v2\/posts\/916\/revisions"}],"predecessor-version":[{"id":991,"href":"http:\/\/mobilelab.khu.ac.kr\/wordpress\/wp-json\/wp\/v2\/posts\/916\/revisions\/991"}],"wp:featuredmedia":[{"embeddable":true,"href":"http:\/\/mobilelab.khu.ac.kr\/wordpress\/wp-json\/wp\/v2\/media\/990"}],"wp:attachment":[{"href":"http:\/\/mobilelab.khu.ac.kr\/wordpress\/wp-json\/wp\/v2\/media?parent=916"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/mobilelab.khu.ac.kr\/wordpress\/wp-json\/wp\/v2\/categories?post=916"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/mobilelab.khu.ac.kr\/wordpress\/wp-json\/wp\/v2\/tags?post=916"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}