tag:blogger.com,1999:blog-14683474213577307852024-02-25T03:03:45.598+08:00泰布布Ted Leehttp://www.blogger.com/profile/03077454870590095355noreply@blogger.comBlogger295125tag:blogger.com,1999:blog-1468347421357730785.post-84304145861949008842023-10-05T15:01:00.036+08:002023-10-09T11:46:18.804+08:00[microbit, 台語歌謠] 小彼特念唱台語:聲調語言是最美的歌謠<h1 style="text-align: center;"> <span style="text-align: center;"> </span>小彼特念唱台語:</h1><h1 style="text-align: center;"><span style="font-size: x-large;">聲調語言是最美的歌謠</span></h1><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><a href="https://www.facebook.com/groups/134149180510967/" style="color: #2288bb; text-decoration-line: none;" target="_blank"><span style="font-family: times, "times new roman", serif;">Ted Lee的土饅頭(To Mentor)工坊</span></a></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><div><span style="font-family: times, "times new roman", serif;">Line:ted2016.kpvs</span><br /><span style="font-family: times, "times new roman", serif;">Email:Lct4246@gmail.com</span><br /><span style="font-family: times, "times new roman", serif;"><span style="font-family: "times new roman", serif;">FB</span>:<span style="font-family: "times new roman", serif;">http://gg.gg/</span><span style="color: #00cc00; font-family: "times new roman", serif;">TedLee</span><span style="color: red; font-family: "times new roman", serif;">FB</span><span style="font-family: "times new roman", serif;">/</span></span></div><div><span lang="" style="font-family: times, "times new roman", serif; font-size: 12pt;">Blog<span style="font-family: "times new roman"; font-size: small;">:</span>http://gg.gg/<span style="color: #00cc00;">TedLee</span><span style="color: red;">Blog</span>/</span><br /></div></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><span style="font-family: times, "times new roman", serif;"><br /></span></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><span style="font-family: times, "times new roman", serif;">Oct. 5, 2023</span></div><div style="text-align: center;"><span><span style="color: #222222; font-family: times, "times new roman", serif;"><span style="font-size: 13.2px;"><div class="separator" style="clear: both;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s88/CC.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="31" data-original-width="88" height="31" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s1600/CC.png" width="88" /></a>[1]</div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6FV7gILuSkmwqqWYSiHPi6eZbAV-E8OVnqmcWQbn4PyulH00chE5hIA9F9jBTDMZFclqrL96YnGlmxdNsGkhr6cgByzjT_Aq8KSuAWMi5ldDVxkWgXHeMaEUfq-T-Oeef4SuS8zp-RtFBo-N23n_HBxPqdTUJ_AaChTGAQgs7XYzLHThA_ag6-9xA/s2048/1.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="2048" data-original-width="1536" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6FV7gILuSkmwqqWYSiHPi6eZbAV-E8OVnqmcWQbn4PyulH00chE5hIA9F9jBTDMZFclqrL96YnGlmxdNsGkhr6cgByzjT_Aq8KSuAWMi5ldDVxkWgXHeMaEUfq-T-Oeef4SuS8zp-RtFBo-N23n_HBxPqdTUJ_AaChTGAQgs7XYzLHThA_ag6-9xA/w300-h400/1.jpg" width="300" /></a></div><div class="separator" style="clear: both; text-align: center;"><br /></div></div></div></span></span></span></div><div style="background: white; text-align: justify; text-indent: 24pt;"><span style="text-indent: 24pt;"><div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; text-indent: 24pt;"><span style="text-indent: 24pt;">台語的八調(獅虎豹鼈猴狗象鹿)就是天生的歌謠 ,不管是以台語發音來念或唱,它多變的聲調變化無一不顯透著這種語言的聽覺之美。</span></div><div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; text-indent: 24pt;"><span style="text-indent: 24pt;">透過簡上仁老師的創見,我們將台語八調整合小彼特的音樂發聲來念、唱與演奏。使得科技得以完美地與台語教育</span><span style="text-indent: 24pt;">結合,並展現出台語源遠流長的豐富內涵。</span></div></span></div><div style="text-align: center;"><br /></div><div style="text-align: center;"><h2 style="text-align: left;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">小彼特說台語八調</span></h2><div style="background: white; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;"><div style="text-align: center;"><div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;"><span style="text-indent: 24pt;">根據簡上仁老師的研究(<a href="https://reurl.cc/ga4p8L" target="_blank">https://reurl.cc/ga4p8L</a>),台語的八調正好可以整理成表 1 的簡譜<b>音調(tone)</b>與之一一對應。</span></div><div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;"><span style="text-indent: 24pt;"><br /></span></div></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: justify;"><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-indent: 0px;"><span style="font-size: x-small;">表 1:台語八調與簡譜音調對應表</span></div><div class="separator" style="clear: both; text-indent: 0px;"><span style="font-size: x-small;"><div class="separator" style="clear: both;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjlPtyuhtkK0Q0o1yy4M_bJ04P16Vd8n6uXNGONVSt1iWZzkayVz9W6jXVU2NhQJCqve9NKXjIexQ09fgT-dyIJITWF8tAW8BmFMCox4Fq85YPAJr9xCC5pi1gpFYj9ApXaXhWhXjU8W5cSJu-mxBwiwwirDmf0gdvAZ6IqRsrWrBXE7cZzYre2Ek1O" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="105" data-original-width="569" height="118" src="https://blogger.googleusercontent.com/img/a/AVvXsEjlPtyuhtkK0Q0o1yy4M_bJ04P16Vd8n6uXNGONVSt1iWZzkayVz9W6jXVU2NhQJCqve9NKXjIexQ09fgT-dyIJITWF8tAW8BmFMCox4Fq85YPAJr9xCC5pi1gpFYj9ApXaXhWhXjU8W5cSJu-mxBwiwwirDmf0gdvAZ6IqRsrWrBXE7cZzYre2Ek1O=w640-h118" width="640" /></a></div></span></div></div></div></div></div></div></div></div></div></div></div></div><div style="background: white; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;"><br /></div><div style="background: white; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;"><span style="text-align: center; text-indent: 24pt;">我們再根據</span><span style="text-align: center; text-indent: 0px;"> </span><a href="https://reurl.cc/9R7LXO" style="text-align: center; text-indent: 0px;" target="_blank">https://reurl.cc/9R7LXO</a><span style="text-align: center; text-indent: 0px;"> 一文詳細的簡譜識讀</span><span style="text-align: center; text-indent: 24pt;">解說,使用 </span><span style="background-color: transparent; text-align: center; text-indent: 0px;">sai、</span><span style="background-color: transparent; text-align: center; text-indent: 0px;">ho2o、</span><span style="background-color: transparent; text-align: center; text-indent: 0px;">pa3a、</span><span style="background-color: transparent; text-align: center; text-indent: 0px;">pa3b、</span><span style="background-color: transparent; text-align: center; text-indent: 0px;">pih、</span><span style="background-color: transparent; text-align: center; text-indent: 0px;">ka5u、</span><span style="background-color: transparent; text-align: center; text-indent: 0px;">ka2u、</span><span style="background-color: transparent; text-align: center; text-indent: 0px;">tshiu7nn、</span><span style="background-color: transparent; text-align: center; text-indent: 0px;">lo8k </span><span style="text-align: center; text-indent: 24pt;">九個<b>函式(function)</b>(</span><span style="background-color: transparent; text-align: center;"><a href="https://reurl.cc/2EzVRn">https://reurl.cc/2EzVRn</a>)</span><span style="text-align: center; text-indent: 24pt;">先定義好這八調的基本調(圖 1),再以上仁老師所舉的台語(唱)歌(念)謠四例來展示台語的</span><span style="text-align: center; text-indent: 24pt;">聲調</span><span style="text-align: center; text-indent: 24pt;">優揚之美感</span><span style="text-align: center; text-indent: 24pt;">。</span></div><div style="background: white; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;"><span style="text-align: center; text-indent: 24pt;"><br /></span></div></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: justify;"><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><span><div class="separator" style="clear: both; font-size: small; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEiciwVr2xmXToxOXAXk_-JXjpD7aPrfByGYuzKWtLJHjPMm78i2RtpfZodWlbjvZ4WO_9IqYHKgNi7ULS_IOsax2ZhxHQ1UO4-4iMD4y1RznppIK2C3akNBpChn5flEGsBQKt_eO_Dh0p8dbYQUD-O5FgOYoxWBbKl8YCu6yAOnFDgwe0lqFh6mK1HJ" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="756" data-original-width="1431" height="338" src="https://blogger.googleusercontent.com/img/a/AVvXsEiciwVr2xmXToxOXAXk_-JXjpD7aPrfByGYuzKWtLJHjPMm78i2RtpfZodWlbjvZ4WO_9IqYHKgNi7ULS_IOsax2ZhxHQ1UO4-4iMD4y1RznppIK2C3akNBpChn5flEGsBQKt_eO_Dh0p8dbYQUD-O5FgOYoxWBbKl8YCu6yAOnFDgwe0lqFh6mK1HJ=w640-h338" width="640" /></a></div>圖 1:台語八調的九個函式</div><div class="separator" style="clear: both; font-size: small; text-align: center;"><br /></div><div class="separator" style="clear: both; text-align: center;"><h2 style="text-align: left;"><span face="標楷體" style="font-size: large; mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">小彼特<span style="color: #2b00fe;">念</span>台語 1:李俊德(姓名)</span></h2><p class="MsoNormal" style="mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;"><span style="text-indent: 24pt;">筆者中文姓名為李俊德,台語的音調為二二四,經過變調後為一一四。於是我們直接呼叫圖 1 的函式來編排「點名」的念名順序(圖 2)。完整的程式碼可由 <a href="https://reurl.cc/RyW7bg" target="_blank">https://reurl.cc/RyW7bg</a> 下載。</span></p><div><br /></div><div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjmW25TruXsHp4wQXHiEFuiemAn_CqdBHn6zhT9q9JZFbMRzfGvF_zaGeGrdX8GID4xMbJH9dxFeGjlBdDopUlrLnH2Q7jlizL8236IEQ96O4SvswWJp7ACAfmd9ZSHAqi6jQvYqXzjWe34lrqM6gkIK1wPQFl6GUrTeeUiACQ_0yhcL9mLStn-jYrb" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="757" data-original-width="1660" height="292" src="https://blogger.googleusercontent.com/img/a/AVvXsEjmW25TruXsHp4wQXHiEFuiemAn_CqdBHn6zhT9q9JZFbMRzfGvF_zaGeGrdX8GID4xMbJH9dxFeGjlBdDopUlrLnH2Q7jlizL8236IEQ96O4SvswWJp7ACAfmd9ZSHAqi6jQvYqXzjWe34lrqM6gkIK1wPQFl6GUrTeeUiACQ_0yhcL9mLStn-jYrb=w640-h292" width="640" /></a></div></div></div></div><div class="separator" style="clear: both; font-size: medium;"><span style="font-size: x-small;">圖 2:念姓名的積木程式</span></div><div style="font-size: small;"><span style="font-size: x-small;"><br /></span></div></div></div></div></div></div></div></span></div></div></div></div></div></div></div></div></div></div></div><h2 style="text-align: left;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">小彼特<span style="color: #2b00fe;">念</span>台語 2:阿公吃西瓜</span></h2><p class="MsoNormal" style="mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;"><span style="text-indent: 24pt;">上仁老師在 <a href="https://reurl.cc/5O4LdR">https://reurl.cc/5O4LdR</a> 這部影片的 </span><span face=""Segoe UI Historic", "Segoe UI", Helvetica, Arial, sans-serif" style="background-color: white; color: #050505; font-size: 15px; text-align: left; white-space-collapse: preserve;">03:17~03:24 展示了台語這類因為</span><span face=""Segoe UI Historic", "Segoe UI", Helvetica, Arial, sans-serif" style="background-color: white; color: #050505; font-size: 15px; text-align: left; white-space-collapse: preserve;">聲調高低起伏變化而自然產生的韻律性之美</span><span style="text-indent: 24pt;">。他舉例:用台語念「阿公吃西瓜」會形成「23623」的音律。因此,我們正好可以用圖 3 的小彼特音樂積木來譜寫這段念謠。</span>完整的程式碼可由<span style="text-indent: 24pt;"> </span><span style="text-align: left; text-indent: 24pt;"><a href="https://reurl.cc/Do4MKQ">https://reurl.cc/Do4MKQ</a> </span><span style="text-indent: 24pt;">下載。</span></p><div style="text-align: center;"><br /></div><div style="text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjunrEhsG6z5Ffi1ZLTZvCbv1KVDKIbFIxxnWA4xuKXA_yDhCL2baRFmStc_GZVD7f0bVQP1DMIu-SB1NVnfFf-YoSjROmJo6VyZxIJmPwFFtiYVbQvHH8OYmBD6JSLneHjE4Hn6NBNBhs5pgoEig-lCVWq9ZFEcGivDT9D3PUwWJQ2SkaDlkiNoABt" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="333" data-original-width="454" height="294" src="https://blogger.googleusercontent.com/img/a/AVvXsEjunrEhsG6z5Ffi1ZLTZvCbv1KVDKIbFIxxnWA4xuKXA_yDhCL2baRFmStc_GZVD7f0bVQP1DMIu-SB1NVnfFf-YoSjROmJo6VyZxIJmPwFFtiYVbQvHH8OYmBD6JSLneHjE4Hn6NBNBhs5pgoEig-lCVWq9ZFEcGivDT9D3PUwWJQ2SkaDlkiNoABt=w400-h294" width="400" /></a></div></div></div></div><div class="separator" style="clear: both;"><span style="font-size: x-small;">圖 3:「阿公吃西瓜」念謠的積木程式</span></div><div class="separator" style="clear: both;"><span style="font-size: x-small;"><br /></span></div><div class="separator" style="clear: both; text-align: justify;"><span><h2><span face="標楷體" style="font-size: large; mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">小彼特<span style="color: #2b00fe;">念</span>台語 3:白鷺絲、天黑黑</span></h2><div style="text-indent: 24pt;"><span style="text-indent: 24pt;"><span face=""Segoe UI Historic", "Segoe UI", Helvetica, Arial, sans-serif" style="background-color: white; color: #050505; font-size: 15px; text-align: start; white-space-collapse: preserve;">上仁老師在影片 </span></span><a href="https://reurl.cc/5O4LdR">https://reurl.cc/5O4LdR</a> 的<span face=""Segoe UI Historic", "Segoe UI", Helvetica, Arial, sans-serif" style="background-color: white; color: #050505; font-size: 15px; text-align: start; text-indent: 24pt; white-space-collapse: preserve;"> 15:02~16:05 中說明台語有著天生的<b>語言性旋律(speech melody)</b>,也就是說只要用「念」的就能展現出旋律之美。他特別舉了台語人耳熟能詳的白鷺絲(豹豹獅 象虎獅 象獅象虎猴,331 721 71715)與天</span><span face=""Segoe UI Historic", "Segoe UI", Helvetica, Arial, sans-serif" style="background-color: white; color: #050505; font-size: 15px; text-align: start; white-space-collapse: preserve;">黑</span><span face=""Segoe UI Historic", "Segoe UI", Helvetica, Arial, sans-serif" style="background-color: white; color: #050505; font-size: 15px; text-align: start; white-space-collapse: preserve;">黑(獅象獅 獅豹猴,171 135)這兩首「念謠」來說明這個現象。我們也以圖 4 的積木程式來念誦。完整的程式碼可從</span><span style="text-indent: 24pt;"> </span><a href="https://reurl.cc/3e7AgO" style="text-indent: 24pt;">https://reurl.cc/3e7AgO</a><span style="text-indent: 24pt;"> 下載。</span></div><div style="font-size: small; text-align: center;"><br /></div><div style="text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; font-size: medium;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEhcglC0efXKiPNZhsllgEAuuAaUZ02PaffhSvG6KIr68o6dbFEwDipuo4ok_yn1yVUPm7Av0rhDOC02m00l8D-xu9GFCqMRN1Jj-rhVJA0UDKr1F3cgxBc-0WachElskjoDTuFsm-Uk-rSKxihfLUYF65OJ-iJ93nz2o_HtvC9NknfXusF-UxEimO4b" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="597" data-original-width="1371" height="278" src="https://blogger.googleusercontent.com/img/a/AVvXsEhcglC0efXKiPNZhsllgEAuuAaUZ02PaffhSvG6KIr68o6dbFEwDipuo4ok_yn1yVUPm7Av0rhDOC02m00l8D-xu9GFCqMRN1Jj-rhVJA0UDKr1F3cgxBc-0WachElskjoDTuFsm-Uk-rSKxihfLUYF65OJ-iJ93nz2o_HtvC9NknfXusF-UxEimO4b=w640-h278" width="640" /></a></div></div></div></div><div class="separator" style="clear: both; font-size: medium;"><span style="font-size: x-small;">圖 4:積木程式</span></div><div class="separator" style="clear: both; font-size: medium;"><span style="font-size: x-small;"><br /></span></div><div class="separator" style="clear: both;"><span><h2 style="font-size: medium; text-align: justify;"><span face="標楷體" style="font-size: large; mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">小彼特<span style="color: #2b00fe;">唱</span>台語 4:採茶歌</span></h2><div style="text-align: justify; text-indent: 24pt;"><span style="text-indent: 24pt;">相同地,我們經由上仁老師的啟發,結合小彼特的</span>左、右<span style="text-indent: 24pt;">、</span><span style="text-indent: 24pt;">上、下傾斜四種</span><b style="text-indent: 24pt;">體感(gesture sensing)</b><span style="text-indent: 24pt;">與</span><b style="text-indent: 24pt;">商標觸控(logo touch)</b><span style="text-indent: 24pt;">,分別對應到 5(sol)、6</span>(ra)<span style="text-indent: 24pt;">、1</span>(do)<span style="text-indent: 24pt;">、2</span>(re)<span style="text-indent: 24pt;">、3</span>(mi)結合台語演奏教學。</div><div style="text-align: justify; text-indent: 24pt;">首先,我們和學員介紹客語民謠重新譜台語歌詞的採茶歌簡譜(<a href="https://reurl.cc/y6Yjo6">https://reurl.cc/y6Yjo6</a>),並截取前兩小節做為演奏練習的藍本。接著,我們再將之與上述的五種手勢組合成圖 5 的演奏手勢控制(完整程式碼可由 <a href="https://reurl.cc/p5rjAl" target="_blank">https://reurl.cc/p5rjAl </a>下載)。最後,我們就能以圖 6(<a href="https://reurl.cc/V4Nvv5" target="_blank">https://reurl.cc/V4Nvv5</a>)的方式帶著學在動手中學唱台語歌謠了。我們實際教學的<span style="text-indent: 24pt;">翦影請讀者們參考這裡 </span><a href="https://reurl.cc/a4LjDl" style="text-indent: 24pt;" target="_blank">https://reurl.cc/a4LjDl</a><span style="text-indent: 24pt;">。</span></div><div style="font-size: medium;"><br /></div><div style="font-size: medium;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEhzY0bQA1Z1NYuf1k4zAyZ3GGWaAnYbe2xqAF06TtQppIDcoN1XPE0R2ePpzdrJmg0KU-rXU_XV4NWMcxGG8YK7L_ndcQIN0oivDiD_Kg69zLoGU09boAsaeq2z7fJ5-kVhrBmKg-8ZdpdvXeUHMAR8ciqiiy4z0P7jDMO2g7nP_f5S50r42CjivW6x" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="541" data-original-width="924" height="374" src="https://blogger.googleusercontent.com/img/a/AVvXsEhzY0bQA1Z1NYuf1k4zAyZ3GGWaAnYbe2xqAF06TtQppIDcoN1XPE0R2ePpzdrJmg0KU-rXU_XV4NWMcxGG8YK7L_ndcQIN0oivDiD_Kg69zLoGU09boAsaeq2z7fJ5-kVhrBmKg-8ZdpdvXeUHMAR8ciqiiy4z0P7jDMO2g7nP_f5S50r42CjivW6x=w640-h374" width="640" /></a></div><span style="font-size: small;">圖 5:演奏手勢控制積木程式</span></div><div style="font-size: medium;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; font-size: medium;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/s9y6PlK70sw" width="320" youtube-src-id="s9y6PlK70sw"></iframe></div></div></div><div class="separator" style="clear: both; font-size: medium;"><span style="font-size: x-small;">圖 6:採茶歌演奏影片</span></div></div></div></div></div></div></span></div></div></div></div></div></div></span></div></div></div></div></div></div><p><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><o:p></o:p></span></p><div style="mso-element: footnote-list;"><hr align="left" size="1" width="33%" /><!--[endif]--><div id="ftn1" style="mso-element: footnote;"><div style="text-align: justify;"><span style="font-size: x-small;">[1] <a href="http://creativecommons.tw/explore" style="color: #2288bb; font-family: times, "times new roman", serif; text-decoration-line: none;" target="_blank">六種授權條款</a><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;">。</span></span></div></div></div>Ted Leehttp://www.blogger.com/profile/03077454870590095355noreply@blogger.com0tag:blogger.com,1999:blog-1468347421357730785.post-27238584501284402612023-06-21T06:10:00.018+08:002023-06-21T19:41:20.838+08:00[app, Thunkable, flowchart] 從流程圖到 Thunkable app_5:計算體脂肪 BMI 值<h1 style="text-align: center;"> <span style="text-align: center;">從流程圖到 Thunkable app_5:</span></h1><h1 style="text-align: center;"><span style="font-size: x-large;">計算體脂肪 BMI 值</span></h1><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><a href="https://www.facebook.com/groups/134149180510967/" style="color: #2288bb; text-decoration-line: none;" target="_blank"><span style="font-family: times, "times new roman", serif;">Ted Lee的土饅頭(To Mentor)工坊</span></a></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><div><span style="font-family: times, "times new roman", serif;">Line:ted2016.kpvs</span><br /><span style="font-family: times, "times new roman", serif;">Email:Lct4246@gmail.com</span><br /><span style="font-family: times, "times new roman", serif;"><span style="font-family: "times new roman", serif;">FB</span>:<span style="font-family: "times new roman", serif;">http://gg.gg/</span><span style="color: #00cc00; font-family: "times new roman", serif;">TedLee</span><span style="color: red; font-family: "times new roman", serif;">FB</span><span style="font-family: "times new roman", serif;">/</span></span></div><div><span lang="" style="font-family: times, "times new roman", serif; font-size: 12pt;">Blog<span style="font-family: "times new roman"; font-size: small;">:</span>http://gg.gg/<span style="color: #00cc00;">TedLee</span><span style="color: red;">Blog</span>/</span><br /></div></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><span style="font-family: times, "times new roman", serif;"><br /></span></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><span style="font-family: times, "times new roman", serif;">June 21, 2023</span></div><div style="text-align: center;"><span><span style="color: #222222; font-family: times, "times new roman", serif;"><span style="font-size: 13.2px;"><div class="separator" style="clear: both;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s88/CC.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="31" data-original-width="88" height="31" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s1600/CC.png" width="88" /></a>[1]</div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><br /></div></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5_VzsdUPj_PExYSElEzfKxluD1ET1fnO1QeI0JS2JF54X8N9ryQUFf9VN5BarFmotbf2gbqJsm1aV9iiREAqOEus7LneuHvBLiakqwzQ8xgo-upZE5MrKq9j_oWltA4Qn-cth_FRlrseEupsUmjYGeZ2zVtvXfwwb653ZJsxE8yw1P4xV4cBY9wZu/s772/1.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="772" data-original-width="442" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5_VzsdUPj_PExYSElEzfKxluD1ET1fnO1QeI0JS2JF54X8N9ryQUFf9VN5BarFmotbf2gbqJsm1aV9iiREAqOEus7LneuHvBLiakqwzQ8xgo-upZE5MrKq9j_oWltA4Qn-cth_FRlrseEupsUmjYGeZ2zVtvXfwwb653ZJsxE8yw1P4xV4cBY9wZu/w229-h400/1.jpg" width="229" /></a> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZW81yTHslqn0EcJNdk7TOS7jJn_OJjQnZYpmzFLY9ISF6xDRjBU9xGqXCFToHLMPaCYoy4w5ETW3Onapvjnx0CDadASHFlLqBhsWzEVgEEAMXb4P85-sEHG_GOa5e6Rj2X8I-XdB1dtXyONPFBYBM3NXQ_REEhCFnmzaxTzER7B8gpVbWprKwz1FZ/s775/1.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="775" data-original-width="446" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZW81yTHslqn0EcJNdk7TOS7jJn_OJjQnZYpmzFLY9ISF6xDRjBU9xGqXCFToHLMPaCYoy4w5ETW3Onapvjnx0CDadASHFlLqBhsWzEVgEEAMXb4P85-sEHG_GOa5e6Rj2X8I-XdB1dtXyONPFBYBM3NXQ_REEhCFnmzaxTzER7B8gpVbWprKwz1FZ/w230-h400/1.jpg" width="230" /></a><br /><br /></div><div class="separator" style="clear: both;"><br /></div></div></div></div></div></span></span></span></div><div style="background: white; text-align: justify; text-indent: 24pt;"><span style="text-indent: 24pt;"><div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; text-indent: 24pt;">本 Thunkable app 系列文之五係改編陳會安老師所著「<span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; text-indent: 0px;">2_fChart_Blockly_Thunkable_變數與運算子(循序結構).pdf(</span><a href="https://drive.google.com/file/d/1TXy-uR4jUYo6TdYb2JPJlemGZnKM4GAy/view?fbclid=IwAR0S2uwiUleH_JAOEF-bdgI74e2wy32-irZ1rHfyFfMt9zKuXbsx9_1BP3A" style="color: #2288bb; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-decoration-line: none; text-indent: 0px;" target="_blank">https://reurl.cc/6NEGRV</a><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; text-indent: 0px;">)」中第 46、81 至 83 頁中攝氏</span><span style="color: #222222; text-indent: 0px;">溫度</span><span style="color: #222222; text-indent: 0px;">轉華氏範例。</span></div><div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; text-indent: 24pt;"><span style="text-indent: 24pt;">第一小節先說明要解決的問題,再將它的解題步驟匯整為陳會安老師設計的 fChart 流程圖(圖 1、2)。最後再著手設計 app 的呈現畫面(圖 3、4)及其背後的控制程式(圖 5)。</span></div></span></div><div style="text-align: center;"><br /></div><div style="text-align: center;"><h1 style="text-align: left;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">問題說明</span></h1><div style="background: white; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;"><span style="text-align: center; text-indent: 24pt;">輸入身高 h(單位:公尺)及體重 w(單位:公斤),使用下列公式自動計算出相對應的<b> BMI(Body Mass Index,身體質量指標)</b>數值:</span></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><span style="background-color: white; text-indent: 32px;"><blockquote><blockquote>BMI = w / h × h,h 以公尺計</blockquote></blockquote></span></div><div class="separator" style="clear: both; text-align: justify;"><span style="background-color: white; text-indent: 32px;"><br /></span></div><div class="separator" style="clear: both; text-align: justify;"><span style="background-color: white; text-indent: 32px;">根據陳會安老師提供的圖 1 流程。</span></div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibcrJmbIDPSDRLlHNYqKA2nLqFJSYawzKNFxOuMfKNLnD1cfMVnPrzzx7QEWkKugb4tRIvexGpuQfaKZAxT76CF2UmeI9gG69pKJtkZ0pEiX_AAzu2SMlO2goo3N5ZZUG7TqpVNE2Tcj8ZdXWiz8R6ge6kvMAWZmjDYf9ssQsdoRSJvfEgMun0rEKS/s589/1.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="589" data-original-width="436" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibcrJmbIDPSDRLlHNYqKA2nLqFJSYawzKNFxOuMfKNLnD1cfMVnPrzzx7QEWkKugb4tRIvexGpuQfaKZAxT76CF2UmeI9gG69pKJtkZ0pEiX_AAzu2SMlO2goo3N5ZZUG7TqpVNE2Tcj8ZdXWiz8R6ge6kvMAWZmjDYf9ssQsdoRSJvfEgMun0rEKS/w296-h400/1.png" width="296" /></a></div></div></div></div></div><div class="separator" style="clear: both;"><span style="font-size: x-small;">圖 1:BMI 的解題流程圖</span></div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both; text-align: justify;">我們說這個人身高 180,基本單位是「公分」。然而,BMI 公式中的身高是要以「公尺」做度量。有句廣告詞說的好:電腦也會煮花生。不管使用者要輸入哪一種,程式應該可以更聰明地自動判斷出來吧?(圖 2)。</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEiKg9Qt8grMSuizQU9ZqvtV9kx-i5qHvrXXsCvwnP-ysrMPaLyoJ5TGJMPj8ka7A6AqE51F1Ld0YJjRWYlS1SE8QFCQg_bAy0KR4GiqOtVwu7o_FanGUVr2tHtTcDHVDWXTgCqZKEttQbxZUdmYXF0YKQyfn6pv-VBIvCJZM5UrtWuhqJMBSc0tVo3b" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="707" data-original-width="402" height="400" src="https://blogger.googleusercontent.com/img/a/AVvXsEiKg9Qt8grMSuizQU9ZqvtV9kx-i5qHvrXXsCvwnP-ysrMPaLyoJ5TGJMPj8ka7A6AqE51F1Ld0YJjRWYlS1SE8QFCQg_bAy0KR4GiqOtVwu7o_FanGUVr2tHtTcDHVDWXTgCqZKEttQbxZUdmYXF0YKQyfn6pv-VBIvCJZM5UrtWuhqJMBSc0tVo3b=w227-h400" width="227" /></a></div></div></div><div class="separator" style="clear: both;"><span style="font-size: x-small;">圖 2:程式會自動判斷身高的單位</span></div><div class="separator" style="clear: both;"><br /></div></div></div><div style="text-align: center;"><h1 style="text-align: left;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">畫面設計</span></h1><div style="background: white; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;"><span style="text-indent: 24pt;">會安老師設計的畫面如圖 3 所示,我們將使用 3 個 Label、</span><span style="text-indent: 24pt;">2 個 Text Input 和 1 個 button 元件來完成。</span></div></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: justify;"><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJV50QdIdztwwCr9a2WySiuYJy_d-zhMjd5mf_cfCld-nCZ6YSJGj0oBNYc-0xpbHNdUv45ldANjQMKNgIgxcGC_rN7hfyXDHBWf1Z1HaCNxM9h3eq5JP4nEYwhYlQgLdqSZUkt7NFTSatmOkhxiHvWfCiIu5DyjLX6hEVtkQr5iPueN-RDCqy__xP/s325/1.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="175" data-original-width="325" height="172" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJV50QdIdztwwCr9a2WySiuYJy_d-zhMjd5mf_cfCld-nCZ6YSJGj0oBNYc-0xpbHNdUv45ldANjQMKNgIgxcGC_rN7hfyXDHBWf1Z1HaCNxM9h3eq5JP4nEYwhYlQgLdqSZUkt7NFTSatmOkhxiHvWfCiIu5DyjLX6hEVtkQr5iPueN-RDCqy__xP/s320/1.png" width="320" /></a></div></div></div></div></div><div class="separator" style="clear: both;"><span style="font-size: x-small;">圖 3:畫面設計圖</span></div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both; text-align: justify;">各元件的命名及其屬性設定詳列如圖 4。</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEj0cFxWPYtvhHtI5-dLK-jiAYQvCfwOG4EaI2YAid9kRB6RvLvMlhgO8jQjbSR5Wza1KyZqs5CZ_NJc9S8-4iSLTIfWq1ixCKf-CA3as4WFe4-LuESUkT8xNNVS-XbmgnHzA0p0Sogign-dueeTh04p-dw4CZkxlyS8i6ngUCIwRqgoJbk8ztbQ4cAk" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="256" data-original-width="852" height="192" src="https://blogger.googleusercontent.com/img/a/AVvXsEj0cFxWPYtvhHtI5-dLK-jiAYQvCfwOG4EaI2YAid9kRB6RvLvMlhgO8jQjbSR5Wza1KyZqs5CZ_NJc9S8-4iSLTIfWq1ixCKf-CA3as4WFe4-LuESUkT8xNNVS-XbmgnHzA0p0Sogign-dueeTh04p-dw4CZkxlyS8i6ngUCIwRqgoJbk8ztbQ4cAk=w640-h192" width="640" /></a></div></div><div class="separator" style="clear: both;"><span style="font-size: x-small;">圖 4:各元件設定</span></div></div></div></div></div></div></div></div></div></div></div></div><div class="separator" style="clear: both;"><span style="background-color: white; text-indent: 32px;"><br /></span></div></div><h1>程式畫面</h1><p class="MsoNormal" style="mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;">在程式自動化方面,當我們輸入完身高與體重,按下按鈕後即開始計算 BMI 值。最後,將計算結果直接<span style="text-indent: 24pt;">更新到畫面最下方的文字標籤即可(圖 5)。</span></p><div style="text-align: center;"><br /></div><div style="text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjRiQdPsFkbHwQEF17C-V4QLBGXcaGUIFKwmai3K_GpIgCG_ryGyVijPrVK-KI6MMF-IWpQ3I-OWlkw1FHWZXGz8bGUL2ZNZWC8mfDmoSV3sHl2TzPRu0tD4HnC8v74EI2c8NV0wm8Z566a0qSkKr3mmUrPds-8rW0KaP9IYt-3X_4-ppPAeprEVxcC" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="243" data-original-width="1326" height="117" src="https://blogger.googleusercontent.com/img/a/AVvXsEjRiQdPsFkbHwQEF17C-V4QLBGXcaGUIFKwmai3K_GpIgCG_ryGyVijPrVK-KI6MMF-IWpQ3I-OWlkw1FHWZXGz8bGUL2ZNZWC8mfDmoSV3sHl2TzPRu0tD4HnC8v74EI2c8NV0wm8Z566a0qSkKr3mmUrPds-8rW0KaP9IYt-3X_4-ppPAeprEVxcC=w640-h117" width="640" /></a></div></div></div><div class="separator" style="clear: both;"><span style="font-size: x-small;">圖 5:積木程式</span></div></div></div></div></div></div><p><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><o:p></o:p></span></p><div style="mso-element: footnote-list;"><hr align="left" size="1" width="33%" /><!--[endif]--><div id="ftn1" style="mso-element: footnote;"><div style="text-align: justify;"><span style="font-size: x-small;">[1] <a href="http://creativecommons.tw/explore" style="color: #2288bb; font-family: times, "times new roman", serif; text-decoration-line: none;" target="_blank">六種授權條款</a><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;">。</span></span></div></div></div>Ted Leehttp://www.blogger.com/profile/03077454870590095355noreply@blogger.com0tag:blogger.com,1999:blog-1468347421357730785.post-64055511883627256932023-05-29T11:03:00.017+08:002023-05-31T06:08:52.888+08:00[app, Thunkable, flowchart] 從流程圖到 Thunkable app_4:攝氏轉華氏溫度<h1 style="text-align: center;"> <span style="text-align: center;">從流程圖到 Thunkable app_4:</span></h1><h1 style="text-align: center;"><span style="font-size: x-large;">攝氏轉華氏溫度</span></h1><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><a href="https://www.facebook.com/groups/134149180510967/" style="color: #2288bb; text-decoration-line: none;" target="_blank"><span style="font-family: times, "times new roman", serif;">Ted Lee的土饅頭(To Mentor)工坊</span></a></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><div><span style="font-family: times, "times new roman", serif;">Line:ted2016.kpvs</span><br /><span style="font-family: times, "times new roman", serif;">Email:Lct4246@gmail.com</span><br /><span style="font-family: times, "times new roman", serif;"><span style="font-family: "times new roman", serif;">FB</span>:<span style="font-family: "times new roman", serif;">http://gg.gg/</span><span style="color: #00cc00; font-family: "times new roman", serif;">TedLee</span><span style="color: red; font-family: "times new roman", serif;">FB</span><span style="font-family: "times new roman", serif;">/</span></span></div><div><span lang="" style="font-family: times, "times new roman", serif; font-size: 12pt;">Blog<span style="font-family: "times new roman"; font-size: small;">:</span>http://gg.gg/<span style="color: #00cc00;">TedLee</span><span style="color: red;">Blog</span>/</span><br /></div></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><span style="font-family: times, "times new roman", serif;"><br /></span></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><span style="font-family: times, "times new roman", serif;">May 29, 2023</span></div><div style="text-align: center;"><span><span style="color: #222222; font-family: times, "times new roman", serif;"><span style="font-size: 13.2px;"><div class="separator" style="clear: both;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s88/CC.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="31" data-original-width="88" height="31" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s1600/CC.png" width="88" /></a>[1]</div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><br /></div></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjp7V1Lu4YtLz2wH0ZLBtXJcOM3Q-dl4F2uQRCX-2bgCeffFJTsueiDkK9s8y_Ins0NwmEddV5B1EkUdh2q5U8wBAGpYvbr1f6FIlca3LL6w9HKY72THWa6xRshbD-qWwoQJsqo6ODubL4ViBm2scQVrvcRAMU2fHYuK1ppKQRkSjbERDpQqtwErA" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="688" data-original-width="396" height="400" src="https://blogger.googleusercontent.com/img/a/AVvXsEjp7V1Lu4YtLz2wH0ZLBtXJcOM3Q-dl4F2uQRCX-2bgCeffFJTsueiDkK9s8y_Ins0NwmEddV5B1EkUdh2q5U8wBAGpYvbr1f6FIlca3LL6w9HKY72THWa6xRshbD-qWwoQJsqo6ODubL4ViBm2scQVrvcRAMU2fHYuK1ppKQRkSjbERDpQqtwErA=w230-h400" width="230" /></a></div></div><br /></div></div></div></span></span></span></div><div style="background: white; text-align: justify; text-indent: 24pt;"><span style="text-indent: 24pt;"><div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; text-indent: 24pt;">本 Thunkable app 系列文之四係改編陳會安老師所著「<span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; text-indent: 0px;">2_fChart_Blockly_Thunkable_變數與運算子(循序結構).pdf(</span><a href="https://drive.google.com/file/d/1TXy-uR4jUYo6TdYb2JPJlemGZnKM4GAy/view?fbclid=IwAR0S2uwiUleH_JAOEF-bdgI74e2wy32-irZ1rHfyFfMt9zKuXbsx9_1BP3A" style="color: #2288bb; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-decoration-line: none; text-indent: 0px;" target="_blank">https://reurl.cc/6NEGRV</a><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; text-indent: 0px;">)」中第 43 至 45 頁中攝氏</span><span style="color: #222222; text-indent: 0px;">溫度</span><span style="color: #222222; text-indent: 0px;">轉華氏範例。</span></div><div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; text-indent: 24pt;"><span style="text-indent: 24pt;">第一小節先說明要解決的問題,再將它的解題步驟匯整為陳會安老師設計的 fChart 流程圖(圖 1、2)。最後再著手設計 app 的呈現畫面(圖 3、4)及其背後的控制程式(圖 5)。</span></div></span></div><div style="text-align: center;"><br /></div><div style="text-align: center;"><h1 style="text-align: left;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">問題說明</span></h1><div style="background: white; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;"><span style="text-align: center; text-indent: 0px;">由鍵盤</span><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; text-align: center; text-indent: 0px;">手動輸入圓的<b>攝</b><span style="font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif;"><b>氏(</b></span></span><span style="background-color: transparent; text-align: center; text-indent: 0px;"><span style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif;"><b>Celsius)</b></span></span><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; text-align: center; text-indent: 0px;"><span style="font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif;">溫度 C </span></span><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; text-align: center; text-indent: 0px;">後</span><b style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: center; text-indent: 0px;"> </b><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; text-align: center; text-indent: 0px;">app 會自動代入以下公式來</span><span style="text-align: center; text-indent: 24pt;">計算出對應的<b>華氏(</b></span><span style="text-align: center;"><b>Fahrenheit</b></span><span style="text-align: center; text-indent: 24pt;"><b>)</b>溫度 F:</span></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><span style="background-color: white; text-indent: 32px;"><blockquote>F = C× 9 / 5 + 32</blockquote></span></div><div class="separator" style="clear: both; text-align: justify;"><span style="background-color: white; text-indent: 32px;"><br /></span></div><div class="separator" style="clear: both; text-align: justify;"><span style="background-color: white; text-indent: 32px;">陳會安老師已提供了如圖 1 的轉換流程。</span></div><div class="separator" style="clear: both; text-align: center;"><br /></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEiLALjWZlDkGqfdp7x3kQ3smw7YvAY-wyaRmZuPx8qKwV4F6OxowTCXiKBwV5tv_Gzk2a59AK61bwjooaaaWBEfH2bB8v__vg9FZc2sqI0euYiS6IFbH3fdHIYme9TSAmf8mSLKfYMuug_vZy5JaUv1seal4XO9F1jawwoLGeza5P2JsvwzPASfSw" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="334" data-original-width="459" height="233" src="https://blogger.googleusercontent.com/img/a/AVvXsEiLALjWZlDkGqfdp7x3kQ3smw7YvAY-wyaRmZuPx8qKwV4F6OxowTCXiKBwV5tv_Gzk2a59AK61bwjooaaaWBEfH2bB8v__vg9FZc2sqI0euYiS6IFbH3fdHIYme9TSAmf8mSLKfYMuug_vZy5JaUv1seal4XO9F1jawwoLGeza5P2JsvwzPASfSw" width="320" /></a></div></div></div></div><div class="separator" style="clear: both;"><span style="font-size: x-small;">圖 1:溫度轉換問題流程圖</span></div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both; text-align: justify;">為了實作的方便起見,我們將圖 1 更精要地濃縮為圖 2 的流程圖。</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEgwj9oL6x5DpbUgrWXV_UsKff7ZNKcTwFKaA2SOUPYVQzOUm-FvnsZhBbTXR7R4P8x577M-DIKVgvn6CXC_5X-Z86-bEcEwkra6J7YOJ4rlIxWBOTF-6OZqUm6w7U65hBh_-pBN30uRh-7sjCkOuI3PWQme_Si1QMvkv9eNnJhQkdM6qVOcsIAlOg" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="578" data-original-width="585" height="240" src="https://blogger.googleusercontent.com/img/a/AVvXsEgwj9oL6x5DpbUgrWXV_UsKff7ZNKcTwFKaA2SOUPYVQzOUm-FvnsZhBbTXR7R4P8x577M-DIKVgvn6CXC_5X-Z86-bEcEwkra6J7YOJ4rlIxWBOTF-6OZqUm6w7U65hBh_-pBN30uRh-7sjCkOuI3PWQme_Si1QMvkv9eNnJhQkdM6qVOcsIAlOg" width="243" /></a></div></div><div class="separator" style="clear: both;"><span style="font-size: x-small;">圖 2:溫度轉換問題的抽象流程圖</span></div><div class="separator" style="clear: both;"><br /></div></div></div><div style="text-align: center;"><h1 style="text-align: left;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">畫面設計</span></h1><div style="background: white; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;"><span style="text-indent: 24pt;">畫面的安排如圖 3 所示,我們使用 3 個 Label </span>和 <span style="text-indent: 24pt;">1 個 Text Input(右上處)元件。</span></div></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: justify;"><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEim6KK1jqO9QhRMcRGhHrbr4oxRxoNNonTQ5rFtT8ahXVhh6byQgRXy4wqpM4lCmqCiPVJGtwxRWCo21BEk89SbA9HPbwRrLjrLYI-7pLFC2Yl698_AKhgsMqx0GsM0FBPxj6hlGEEmV2HbPPu1uLIa3EUi4OHzGVVmJ59fYCo8DsL-pFb0xbuuMg" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="673" data-original-width="383" height="400" src="https://blogger.googleusercontent.com/img/a/AVvXsEim6KK1jqO9QhRMcRGhHrbr4oxRxoNNonTQ5rFtT8ahXVhh6byQgRXy4wqpM4lCmqCiPVJGtwxRWCo21BEk89SbA9HPbwRrLjrLYI-7pLFC2Yl698_AKhgsMqx0GsM0FBPxj6hlGEEmV2HbPPu1uLIa3EUi4OHzGVVmJ59fYCo8DsL-pFb0xbuuMg=w228-h400" width="228" /></a></div></div></div></div><div class="separator" style="clear: both;"><span style="font-size: x-small;">圖 3:畫面設計圖</span></div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both; text-align: justify;">各元件的命名及其屬性設定詳列如圖 4。</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDlBEzCLTO0ER5N8nerH0pEdeUbBnXmXNFPNKPl_bIEe4ZplZynG2-JjtfoflLpypS4e-VsOBRaj1vfz2KPyoaKDRKK9BN_Es6hx0USmGAmUZ4dWRR1nByOK39T2lgBTg4Xvov7kbvVJQ9g_vQhO1acHkt-3Ig50oUQMMxfpNVy8EB0dMQ6Vx61A/s1058/Snap4.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="414" data-original-width="1058" height="250" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDlBEzCLTO0ER5N8nerH0pEdeUbBnXmXNFPNKPl_bIEe4ZplZynG2-JjtfoflLpypS4e-VsOBRaj1vfz2KPyoaKDRKK9BN_Es6hx0USmGAmUZ4dWRR1nByOK39T2lgBTg4Xvov7kbvVJQ9g_vQhO1acHkt-3Ig50oUQMMxfpNVy8EB0dMQ6Vx61A/w640-h250/Snap4.jpg" width="640" /></a></div><div class="separator" style="clear: both; text-align: center;"><span style="font-size: x-small;">圖 4:各元件設定</span></div></div></div></div></div></div></div></div></div></div></div></div><div class="separator" style="clear: both;"><span style="background-color: white; text-indent: 32px;"><br /></span></div></div><h1>程式畫面</h1><p class="MsoNormal" style="mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;">在程式自動化方面,當我們輸入完華氏溫度時會<b>觸發(trigger)改變(Changes)</b>事件,於是我們立刻計算對應的華氏溫度並更新顯示結果(圖 5)。</p><div style="text-align: center;"><br /></div><div style="text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEj8gL0ev8zWPFO7zvyhHupO3utcxwnYJ32yX4ScTSrlQOt5-Dzzi36io9VO31l1_Pfg6JO8xGqO38k_pbEbNU8gdciVFJGuSjCURtPFHzPKIdulLePeKAhc5ffX1pj5LLJpthrj0hWFCkxqKSiLYdDuMlLzDjnFqEb7o4GzoexWF12RA2hAhUlo4w" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="132" data-original-width="896" height="94" src="https://blogger.googleusercontent.com/img/a/AVvXsEj8gL0ev8zWPFO7zvyhHupO3utcxwnYJ32yX4ScTSrlQOt5-Dzzi36io9VO31l1_Pfg6JO8xGqO38k_pbEbNU8gdciVFJGuSjCURtPFHzPKIdulLePeKAhc5ffX1pj5LLJpthrj0hWFCkxqKSiLYdDuMlLzDjnFqEb7o4GzoexWF12RA2hAhUlo4w=w640-h94" width="640" /></a></div></div><div class="separator" style="clear: both; text-align: center;"><span style="font-size: x-small;">圖 5:積木程式</span></div><div class="separator" style="clear: both; text-align: center;"><span style="font-size: small;"><br /></span></div><div class="separator" style="clear: both; text-align: center;"><span style="font-size: small;"><h1 style="text-align: left;">進階思考</h1><p class="MsoNormal" style="mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;">請讀者們動動腦,將以上的問題修改為華氏溫度轉換為攝氏溫度。或者,調整為不管是輸入哪一種溫標,程式都能自動處理。</p></span></div></div></div></div></div></div><p><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><o:p></o:p></span></p><div style="mso-element: footnote-list;"><hr align="left" size="1" width="33%" /><!--[endif]--><div id="ftn1" style="mso-element: footnote;"><div style="text-align: justify;"><span style="font-size: x-small;">[1] <a href="http://creativecommons.tw/explore" style="color: #2288bb; font-family: times, "times new roman", serif; text-decoration-line: none;" target="_blank">六種授權條款</a><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;">。</span></span></div></div></div>Ted Leehttp://www.blogger.com/profile/03077454870590095355noreply@blogger.com0tag:blogger.com,1999:blog-1468347421357730785.post-24945802396322831822023-05-04T17:09:00.006+08:002023-05-04T17:09:48.988+08:00 準博和他的教科書<div class="x11i5rnm xat24cr x1mh8g0r x1vvkbs xtlvy1s x126k92a" style="background-color: white; color: #050505; font-family: "Segoe UI Historic", "Segoe UI", Helvetica, Arial, sans-serif; font-size: 15px; margin: 0.5em 0px 0px; overflow-wrap: break-word; white-space: pre-wrap;"><div dir="auto" style="font-family: inherit;">刘教授是我大學教計結的老師。那年,他拿到WU的PhD後就回台教書。</div><div dir="auto" style="font-family: inherit;">有一次,他在課堂中提到他本來只打算取得master後就回國找工作,但家人覺得既然碩士都拿了,何不乾脆攻博?於是他又花了5年拿了博士。</div><div dir="auto" style="font-family: inherit;">就在他取得學位的當下,在他腦袋中最想做的一件事是:</div><div dir="auto" style="font-family: inherit;">燒掉所有手邊的教科書,一本也不帶回台。</div></div><div class="x11i5rnm xat24cr x1mh8g0r x1vvkbs xtlvy1s x126k92a" style="background-color: white; color: #050505; font-family: "Segoe UI Historic", "Segoe UI", Helvetica, Arial, sans-serif; font-size: 15px; margin: 0.5em 0px 0px; overflow-wrap: break-word; white-space: pre-wrap;"><div dir="auto" style="font-family: inherit;">身体疼痛了快一週,這週間聽了蔣勲新述莊子。千年來,老莊出世的謬見,在這一刻徹底的打破、澄清。</div><div dir="auto" style="font-family: inherit;">我也突然懂了刘教授沒燒掉他留學七年所買下的教科書的心境───就好比我那批小屁孩,才上了半學年,就把七下的課本丟了那般。青春,急於拋棄一切振翅遨翔。等到騰空幾萬里才發現:忘了帶<span style="font-family: inherit;">降落傘</span> …</div></div>Ted Leehttp://www.blogger.com/profile/03077454870590095355noreply@blogger.com0tag:blogger.com,1999:blog-1468347421357730785.post-72757008527728250042023-04-30T11:30:00.016+08:002023-05-03T21:03:37.088+08:00[app, Thunkable, flowchart] 從流程圖到 Thunkable app_3:計算圓面積<h1 style="text-align: center;"> 從流程圖到 Thunkable app_3:</h1><h1 style="text-align: center;"><span style="font-size: x-large;">計算圓面積</span></h1><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><a href="https://www.facebook.com/groups/134149180510967/" style="color: #2288bb; text-decoration-line: none;" target="_blank"><span style="font-family: times, "times new roman", serif;">Ted Lee的土饅頭(To Mentor)工坊</span></a></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><div><span style="font-family: times, "times new roman", serif;">Line:ted2016.kpvs</span><br /><span style="font-family: times, "times new roman", serif;">Email:Lct4246@gmail.com</span><br /><span style="font-family: times, "times new roman", serif;"><span style="font-family: "times new roman", serif;">FB</span>:<span style="font-family: "times new roman", serif;">http://gg.gg/</span><span style="color: #00cc00; font-family: "times new roman", serif;">TedLee</span><span style="color: red; font-family: "times new roman", serif;">FB</span><span style="font-family: "times new roman", serif;">/</span></span></div><div><span lang="" style="font-family: times, "times new roman", serif; font-size: 12pt;">Blog<span style="font-family: "times new roman"; font-size: small;">:</span>http://gg.gg/<span style="color: #00cc00;">TedLee</span><span style="color: red;">Blog</span>/</span><br /></div></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><span style="font-family: times, "times new roman", serif;"><br /></span></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><span style="font-family: times, "times new roman", serif;">Apr. 30, 2023</span></div><div style="text-align: center;"><span><span style="color: #222222; font-family: times, "times new roman", serif;"><span style="font-size: 13.2px;"><div class="separator" style="clear: both;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s88/CC.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="31" data-original-width="88" height="31" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s1600/CC.png" width="88" /></a>[1]</div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><br /></div></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEix9fWm78sPAnxLTvv-av3SbDgY5ueArg63OK7ouAQ_wZzLll5zoaGQOWsDz6x3o22ks-MGW36XWv-U7ZfkK769otjWqsY2NxLMFj9tBVeJsX7_R2hcwfqMwkcVQu1o1zUYdVJSZZ1-jC38zxK5bJzE8EMezcij1q9ob-47WDf0E4MPi8C8gt22Og" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="859" data-original-width="495" height="400" src="https://blogger.googleusercontent.com/img/a/AVvXsEix9fWm78sPAnxLTvv-av3SbDgY5ueArg63OK7ouAQ_wZzLll5zoaGQOWsDz6x3o22ks-MGW36XWv-U7ZfkK769otjWqsY2NxLMFj9tBVeJsX7_R2hcwfqMwkcVQu1o1zUYdVJSZZ1-jC38zxK5bJzE8EMezcij1q9ob-47WDf0E4MPi8C8gt22Og=w230-h400" width="230" /></a></div><br /></div></div></div></span></span></span></div><div style="background: white; text-align: justify; text-indent: 24pt;"><span style="text-indent: 24pt;"><div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; text-indent: 24pt;">本 Thunkable app 系列文之三係改編陳會安老師所著「<span style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-indent: 0px;">2_fChart_Blockly_Thunkable_變數與運算子(循序結構).pdf(</span><a href="https://drive.google.com/file/d/1TXy-uR4jUYo6TdYb2JPJlemGZnKM4GAy/view?fbclid=IwAR0S2uwiUleH_JAOEF-bdgI74e2wy32-irZ1rHfyFfMt9zKuXbsx9_1BP3A" style="color: #2288bb; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-decoration-line: none; text-indent: 0px;" target="_blank">https://reurl.cc/6NEGRV</a><span style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-indent: 0px;">)」中第 40 至 42 頁中計算圓面積範例。</span></div><div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; text-indent: 24pt;"><span style="text-indent: 24pt;">第一小節先說明要解決的問題,再將它的解題步驟匯整為陳會安老師設計的 fChart 流程圖(圖 1、2)。最後再著手設計 app 的呈現畫面(圖 3、4)及其背後的控制程式(圖 5)。</span></div></span></div><div style="text-align: center;"><br /></div><div style="text-align: center;"><h1 style="text-align: left;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">問題說明</span></h1><div style="background: white; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;">由鍵盤<span style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-indent: 0px;">手動輸入圓的</span><b style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-indent: 0px;">半徑(radius)</b><span style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-indent: 0px;">後</span><b style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-indent: 0px;"> </b><span style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-indent: 0px;">app 會自動</span>計算該圓的面積,並將之繪於畫面上。</div><div style="background: white; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;">陳會安老師提供了本問題前半段的解決流程:輸入圓的半徑 r,自動計算其面積,如圖 2 所示。</div><div style="background: white; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;"><br /></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEiICSi4GB_NQ3YPWJRcCkbgTZ5AFNBU4CyNpvPlDjX0FzXR6qPY6sCqY5O0g83ipZHgmBhGi5VtvFyoVlov_yplqJjYRurqCGANbdfGpvpqkoO5sQxQ3Wj76ytiHWbse0Q3mUnWvMIzlMJdL6gR9ewdYV441QMJwgieRDEnbHHz00_6PNToWR1BFw" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="557" data-original-width="260" height="400" src="https://blogger.googleusercontent.com/img/a/AVvXsEiICSi4GB_NQ3YPWJRcCkbgTZ5AFNBU4CyNpvPlDjX0FzXR6qPY6sCqY5O0g83ipZHgmBhGi5VtvFyoVlov_yplqJjYRurqCGANbdfGpvpqkoO5sQxQ3Wj76ytiHWbse0Q3mUnWvMIzlMJdL6gR9ewdYV441QMJwgieRDEnbHHz00_6PNToWR1BFw=w187-h400" width="187" /></a></div></div></div><div class="separator" style="clear: both;"><span style="font-size: x-small;">圖 1:長方形面積的計算流程</span></div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both; text-align: justify;">緊接著,要以半徑 r 在畫面上實際畫出該圓,如圖 2 所示。</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEgypRmrQG2lYvrS3lyQ9qN6RZn8p4U96P-9NfdpMZGlxyPzRm6BlI2B0skzsysNkyQPol-cvwvH-PNK5iKnDW0MynJdPgdQ8ooRVycLvpJijhPyg0kSc5kRRVdUpxUB9jjnQ5pZMXyS6X2wWp3hFD9eimL0tpNIpPOjneMavTvVi0uBgLX4BQPHAg" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="273" data-original-width="198" height="240" src="https://blogger.googleusercontent.com/img/a/AVvXsEgypRmrQG2lYvrS3lyQ9qN6RZn8p4U96P-9NfdpMZGlxyPzRm6BlI2B0skzsysNkyQPol-cvwvH-PNK5iKnDW0MynJdPgdQ8ooRVycLvpJijhPyg0kSc5kRRVdUpxUB9jjnQ5pZMXyS6X2wWp3hFD9eimL0tpNIpPOjneMavTvVi0uBgLX4BQPHAg" width="174" /></a></div><div class="separator" style="clear: both;"><span style="font-size: x-small;">圖 2:計算圓面積並繪圖的解題流程</span></div><div class="separator" style="clear: both;"><br /></div></div></div><div style="text-align: center;"><h1 style="text-align: left;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">畫面設計</span></h1><div style="background: white; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;"><span style="text-indent: 24pt;">畫面的安排如圖 3 所示,我們使用 3 個 Label、1 個 Text Input 和 1 個 Canvas(畫布)元件。</span></div></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: justify;"><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><br /></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjipaLcN0QnEZqnHU2SQnvbV5lVvjfYNwc4M4CcSXCrTspSIHDazMUPZrdpZVfHN2jmXmnJWMJw62wtRtlwD0WKaAQ5c-uullHI_3WR_5QlO0rYtTk-h8QoQs6XBuG6Mb-gGSeKUqEVbjKO9o9ukKAC22YAqLmF1fktYIBfsO6qnxfKdQiWaVoWJA" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="840" data-original-width="475" height="400" src="https://blogger.googleusercontent.com/img/a/AVvXsEjipaLcN0QnEZqnHU2SQnvbV5lVvjfYNwc4M4CcSXCrTspSIHDazMUPZrdpZVfHN2jmXmnJWMJw62wtRtlwD0WKaAQ5c-uullHI_3WR_5QlO0rYtTk-h8QoQs6XBuG6Mb-gGSeKUqEVbjKO9o9ukKAC22YAqLmF1fktYIBfsO6qnxfKdQiWaVoWJA=w227-h400" width="227" /></a></div></div></div><div class="separator" style="clear: both;"><span style="font-size: x-small;">圖 3:畫面設計圖</span></div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both; text-align: justify;">各元件的命名及其屬性設定詳列如圖 4。</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjJnucwU3g7Zy2bQw-ijda5T9VUFkr-Q0fXNdgt1SpqoVqyLYBXHxMFAutqtQHi-fz-WkcrqpzCmuq-wpnfVIKHIWsSaP8KhzDHXoohbtPBKvV95IdKWnXNaa3DtKnw93mO0drsNfsH1HiLd6eHcXOOolWgtLNIHJiJuubXsUwbeBosgVCaTNvAqg" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="484" data-original-width="1348" height="230" src="https://blogger.googleusercontent.com/img/a/AVvXsEjJnucwU3g7Zy2bQw-ijda5T9VUFkr-Q0fXNdgt1SpqoVqyLYBXHxMFAutqtQHi-fz-WkcrqpzCmuq-wpnfVIKHIWsSaP8KhzDHXoohbtPBKvV95IdKWnXNaa3DtKnw93mO0drsNfsH1HiLd6eHcXOOolWgtLNIHJiJuubXsUwbeBosgVCaTNvAqg=w640-h230" width="640" /></a></div></div></div></div><span style="font-size: x-small;">圖 4:各元件設定</span></div></div></div></div></div></div></div><div class="separator" style="clear: both;"><span style="background-color: white; text-indent: 32px;"><br /></span></div></div><h1>程式畫面</h1><p class="MsoNormal" style="mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;">在程式自動化方面,當我們輸入完圓形的半徑時會<b>觸發(trigger)改變(Changes)</b>事件,於是我們立刻計算該圓的面積並在畫布上畫出它的形狀(圖 5)。</p><div style="text-align: center;"><br /></div><div style="text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEj8FDO-ANpUIKdOSt9ufuUrmghrtEl27fitigKI8iojAc9mNcUe338U-kLFhXi8-kyvbUb1JyPv55eqowj2UxVbok5BqDYNDkiZ-Hp1wamO2tW31OXfnvsJVnZths-9bN1TMrgfScFeLOLjEOuigR_NnvoyDaaOEHJOEkKFmF_dPAaorpbse3wHDA" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="469" data-original-width="859" height="350" src="https://blogger.googleusercontent.com/img/a/AVvXsEj8FDO-ANpUIKdOSt9ufuUrmghrtEl27fitigKI8iojAc9mNcUe338U-kLFhXi8-kyvbUb1JyPv55eqowj2UxVbok5BqDYNDkiZ-Hp1wamO2tW31OXfnvsJVnZths-9bN1TMrgfScFeLOLjEOuigR_NnvoyDaaOEHJOEkKFmF_dPAaorpbse3wHDA=w640-h350" width="640" /></a></div><span style="font-size: small;">圖 5:積木程式</span></div></div></div><p><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><o:p></o:p></span></p><div style="mso-element: footnote-list;"><hr align="left" size="1" width="33%" /><!--[endif]--><div id="ftn1" style="mso-element: footnote;"><div style="text-align: justify;"><span style="font-size: x-small;">[1] <a href="http://creativecommons.tw/explore" style="color: #2288bb; font-family: times, "times new roman", serif; text-decoration-line: none;" target="_blank">六種授權條款</a><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;">。</span></span></div></div></div>Ted Leehttp://www.blogger.com/profile/03077454870590095355noreply@blogger.com0tag:blogger.com,1999:blog-1468347421357730785.post-15545922900400469602023-04-05T09:06:00.074+08:002023-11-04T10:28:56.519+08:00[機電整合, 運算思維, OpenRoberta] 機電整合之運算思維訓練 1:以 Open Roberta Lab 開發平台為例<h1 style="text-align: center;"> <span style="text-align: center;"> </span><span style="font-size: xx-large; text-align: center;">機電整合之運算思維訓練 1:</span></h1><h1 style="text-align: center;"><span style="font-size: x-large;">以 Open Roberta Lab 開發平台為例</span><span style="font-size: x-small; font-weight: 400;">[1]</span></h1><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><a href="https://www.facebook.com/groups/134149180510967/" style="color: #2288bb; text-decoration-line: none;" target="_blank"><span style="font-family: times, "times new roman", serif;">Ted Lee的土饅頭(To Mentor)工坊</span></a></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><div><span style="font-family: times, "times new roman", serif;">Line:ted2016.kpvs</span><br /><span style="font-family: times, "times new roman", serif;">Email:Lct4246@gmail.com</span><br /><span style="font-family: times, "times new roman", serif;"><span style="font-family: "times new roman", serif;">FB</span>:<span style="font-family: "times new roman", serif;">http://gg.gg/</span><span style="color: #00cc00; font-family: "times new roman", serif;">TedLee</span><span style="color: red; font-family: "times new roman", serif;">FB</span><span style="font-family: "times new roman", serif;">/</span></span></div><div><span lang="" style="font-family: times, "times new roman", serif; font-size: 12pt;">Blog<span style="font-family: "times new roman"; font-size: small;">:</span>http://gg.gg/<span style="color: #00cc00;">TedLee</span><span style="color: red;">Blog</span>/</span><br /></div></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><span style="font-family: times, "times new roman", serif;"><br /></span></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><span style="font-family: times, "times new roman", serif;">Apr. 5, 2023</span></div><div style="text-align: center;"><span><span style="color: #222222; font-family: times, "times new roman", serif;"><span style="font-size: 13.2px;"><div class="separator" style="clear: both;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s88/CC.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="31" data-original-width="88" height="31" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s1600/CC.png" width="88" /></a>[2]</div><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiV3zVKZOrhUrzDLHNumwRUKM9cwDiB_-Ym-dqeonREODewpbJTJhM4sbevK6Bpu-wUGLeJ_BJHE4nx9ThmuSRplxwmCAC9yP_JiqK15SyeCoCiHpxTb7yVOVFbEbZn6UbV_53h3aHNlwILRwaGE3NUWKU8SI6aiHHWGbRcLpVhHiF14dfhbs-80A/s905/TrafficSafty.gif" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="592" data-original-width="905" height="209" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiV3zVKZOrhUrzDLHNumwRUKM9cwDiB_-Ym-dqeonREODewpbJTJhM4sbevK6Bpu-wUGLeJ_BJHE4nx9ThmuSRplxwmCAC9yP_JiqK15SyeCoCiHpxTb7yVOVFbEbZn6UbV_53h3aHNlwILRwaGE3NUWKU8SI6aiHHWGbRcLpVhHiF14dfhbs-80A/s320/TrafficSafty.gif" width="320" /></a></div><br /><div class="separator" style="clear: both;"><br /></div></div><div class="separator" style="clear: both;"><br /></div></span></span></span></div><div style="background: white; text-align: justify; text-indent: 24pt;"><span style="text-indent: 24pt;"><div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; text-indent: 24pt;">Arduino-like 的自走車教具要訓練學生學習什麼?硬體?軟體?STEM/STEAM?</div><div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; text-indent: 24pt;">如果說是學習硬體(機構、電控),那車輪幾輪才好?車的外形要設計成休旅車款嗎?…。</div><div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; text-indent: 24pt;">如果說是學習軟體(電控程式設計),那軟體學習需要綁一款硬體不可嗎?</div><div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; text-indent: 24pt;">…</div><div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; text-indent: 24pt;">科技的本質在於軟硬體知識的<b>整合(integration)</b>。硬體知識的核心在<b>設計思考(design thinking)</b>。另一方面,軟體知識的核心在<b>運算思維(computational thinking)</b>。</div><div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; text-indent: 24pt;">本 Open Roberta Lab 開發平台系列文將著眼在以運算思維培養<b>解決問題(problem solving)</b>的能力:先詳述問題的內含,再甞試將對應的解決過程描繪成<b>流程圖(flowchart)</b>。最後,以純軟體<b>模擬(simulation)</b>的方式來<b>實現(implement)</b>之。</div></span></div><div style="text-align: center;"><br /></div><div style="text-align: center;"><h1 style="text-align: left;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">機電整合學習法</span></h1><h1 style="text-align: left;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";"><div style="background: white; font-size: medium; font-weight: 400; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;"><span style="text-indent: 24pt;">廠商會因為教育市場的利基不斷地設計出各種軟硬體<span style="color: red;">套件</span>,而現今的這些套件多半是將昔日專業機電技術相互結合的最終產物。在學習上,先以套件成品來吸引初學者的學習興趣後,再將之逐一<span style="color: red;">拆解</span>為</span>基礎的原子知識<span style="text-indent: 24pt;">以利後續相關應用的整合,我們將之稱為「拼圖法」(最終的作品是各部件的組合)。以前述提及的自走車為例,我們在《</span><span style="background-color: transparent; text-align: center;">廢材車之廢等級</span><span style="background-color: transparent; text-align: center;">》</span><span style="background-color: transparent; text-align: center;">(</span><span style="background-color: transparent; text-align: center;"><a href="https://reurl.cc/9VxyMd">https://reurl.cc/9VxyMd</a>)</span><span style="background-color: transparent; text-align: center; text-indent: 24pt;">一文中,已呈現了從套件拆解至原子知識的方法了。讀者們可細細推敲這其中的意涵。</span></div><div style="background: white; font-size: medium; font-weight: 400; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;"><span style="background-color: transparent; text-align: center; text-indent: 24pt;">另外,將需要的原子知識逐步<span style="color: red;">整合</span>成為一個<span style="color: red;">專案</span>亦為實務上常見的一種問題解決方法,我們將之稱為「積木法」(以眾小積木堆積成最終的作品)。</span></div></span></h1><div style="background: white; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;">如圖 1,至於拼圖法或積木法的學習選擇,仍應端賴學習者的特質而選定之。但是,前者的要義在拆解;後者則著重在整合的層面上。這是學習時所需要特別留意的要項。</div><div style="background: white; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;"><br /></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoeFcRZKwUEmVyDAfQB89o1fuqMRpsGZg5iqrqWTSoIpaHQzSXUmG8Hvh7qhhqanPXaWAVoNkMNgJRkHs75WiVv1i-zzoYza-XRpWLwYm9jy2FzapY0xAgpoKNi7m6zGP191HBdj8j6hx2hmC5GArAIi7q7OrYfOTaXNPt1pniSTyumHW1BG-snw/s636/%E5%A5%97%E4%BB%B6%20vs.%20%E5%B0%88%E6%A1%88.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="276" data-original-width="636" height="278" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoeFcRZKwUEmVyDAfQB89o1fuqMRpsGZg5iqrqWTSoIpaHQzSXUmG8Hvh7qhhqanPXaWAVoNkMNgJRkHs75WiVv1i-zzoYza-XRpWLwYm9jy2FzapY0xAgpoKNi7m6zGP191HBdj8j6hx2hmC5GArAIi7q7OrYfOTaXNPt1pniSTyumHW1BG-snw/w640-h278/%E5%A5%97%E4%BB%B6%20vs.%20%E5%B0%88%E6%A1%88.png" width="640" /></a></div><div class="separator" style="clear: both; text-align: center;"><span style="font-size: x-small;">圖 1:機電整合之套件與專案學習法</span></div></div><div class="separator" style="clear: both;"><br /></div></div><div style="text-align: center;"><h1 style="text-align: left;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">問題描述:</span>開車經過經斑馬線</h1><div style="background: white; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;"><span style="text-indent: 24pt;">小羅開車來到了十字路口(圖 2),請設計一科技駕駛方式(車上裝有<b>顏色感測器(color sensor)</b>),在「禮讓行人,行車安全」的前提下順利通過。註:</span>圖 2 的街道圖為 Scratch 內建的背景圖,老婆婆圖示「<span style="text-indent: 0px;">cartoon grandma with crutches」</span>取用自 <a href="https://reurl.cc/7RnQDN" style="text-indent: 0px;">https://reurl.cc/7RnQDN</a><span style="text-indent: 24pt;">。組合的完整圖檔「</span><span style="background-color: transparent; text-align: center;">Urban+grandma.jpg」</span><span style="text-indent: 24pt;">可由 </span><span style="background-color: transparent; text-align: center;"><a href="https://reurl.cc/WD76mL">https://reurl.cc/WD76mL</a></span><span style="text-indent: 24pt;"> 下載。</span></div></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both;"><span style="background-color: white; text-indent: 32px;"><br /></span></div><div class="separator" style="clear: both;"><span style="background-color: white; text-indent: 32px;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEiVl6t4ocyGdtDVfOCuqh5LKbvDINvc-uBdKnHyeHD0dXad4VjRyNt9goVj3I0cNwZww1Kexb3iMmNLrNi8nq4AUE_HpZfOcNn6bbQ6MUGN6am-Dt-B_fSumIM63H__ZE-LTrrTeg1x-eE0_Q7FV9gM0auR69ylcRb4M9hJ_HEAI0cizGVjTvJY6w" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="725" data-original-width="990" height="293" src="https://blogger.googleusercontent.com/img/a/AVvXsEiVl6t4ocyGdtDVfOCuqh5LKbvDINvc-uBdKnHyeHD0dXad4VjRyNt9goVj3I0cNwZww1Kexb3iMmNLrNi8nq4AUE_HpZfOcNn6bbQ6MUGN6am-Dt-B_fSumIM63H__ZE-LTrrTeg1x-eE0_Q7FV9gM0auR69ylcRb4M9hJ_HEAI0cizGVjTvJY6w=w400-h293" width="400" /></a></div><span style="font-size: x-small;">圖 2:十字路口場景</span><br /></span></div><div class="separator" style="clear: both; text-align: justify;"><br /></div></div><h1><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">解題流程</span></h1><p class="MsoNormal" style="mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;"><span>使用運算思維的方法,詳列其</span>四步驟如下:</p><p class="MsoNormal" style="mso-char-indent-count: 2.0; text-align: justify; text-justify: inter-ideograph;"></p><span style="text-indent: 24pt;">1. </span><span style="color: #2b00fe; text-indent: 24pt;"><b>拆解(decomposition)</b></span><span style="text-indent: 24pt;"> 將上述的「開車經過經斑馬線」問題拆解為:</span>前進、處理斑馬線識別、前進、左轉、前進、處理老婆婆過斑馬線、前進(圖 3)。<br /><p></p><div style="text-align: center;"><br /></div><div style="text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjpwdPaCNgqRdUZh11cO9TRqbyiwXFWm1YvnVI9RC0H0Uqp1hroBdjoLMcZV4a6z2eCrSGENzOqb9IqfAkFoFlpIE_wA3TNA0-Bku9Z62U5eCbSv5iO82fpj1V-m08BhJ5-s9DBu0FtrT94-kBolN9WubMyiFW7-4nXR21MENh4RMFr5hBuI-BMKw" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="684" data-original-width="904" height="240" src="https://blogger.googleusercontent.com/img/a/AVvXsEjpwdPaCNgqRdUZh11cO9TRqbyiwXFWm1YvnVI9RC0H0Uqp1hroBdjoLMcZV4a6z2eCrSGENzOqb9IqfAkFoFlpIE_wA3TNA0-Bku9Z62U5eCbSv5iO82fpj1V-m08BhJ5-s9DBu0FtrT94-kBolN9WubMyiFW7-4nXR21MENh4RMFr5hBuI-BMKw" width="317" /></a></div></div></div></div></div><div style="text-align: center;"><span face="標楷體" style="font-size: x-small; mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">圖 3:問題拆解</span></div><div style="text-align: center;"><span face="標楷體" style="font-size: x-small; mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";"><br /></span></div><div style="text-align: justify;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">2. <span style="color: #2b00fe;"><b>模式識別(pattern recognition)</b> </span>觀察 1 的拆解內容,可以看出有前進控制、斑馬線處理、左轉三種模式。</span></div><div style="text-align: justify;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">3. <span style="color: #2b00fe;"><b>抽象化(abstraction)</b></span> <span style="text-align: left; text-indent: 32px;">開車經過經斑馬線</span>時的處理方式:慢行、停車再開。</span></div><div style="text-align: justify;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">4. <span style="color: #2b00fe;"><b>演算法(algorithm)</b></span> 以圖 4 的流程圖來詳述此問題的解決步驟。<br /><br /></span></div><div style="text-align: center;"><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEhWyvjoepZe4_-99M_hrJVUM_OP1LgiXIrRLF3eJkTMGMnh0C1VzKP9TafJn9BdCcSBH7UGl4pa3R-mpwFpCnVBAaQpCRh7Q387wNO6aqx8hcoW3RZveCWFC-D-6HlaCgHZ14WlyjxXOf92RvslU7FCgzrFPfiZq51lql0AhzDA45VgrIZ627kdvw" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="667" data-original-width="241" height="640" src="https://blogger.googleusercontent.com/img/a/AVvXsEhWyvjoepZe4_-99M_hrJVUM_OP1LgiXIrRLF3eJkTMGMnh0C1VzKP9TafJn9BdCcSBH7UGl4pa3R-mpwFpCnVBAaQpCRh7Q387wNO6aqx8hcoW3RZveCWFC-D-6HlaCgHZ14WlyjxXOf92RvslU7FCgzrFPfiZq51lql0AhzDA45VgrIZ627kdvw=w232-h640" width="232" /></a></div><span style="font-size: x-small;">圖 4:行經斑馬線問題的流程圖</span><br /><br /></div></div><div style="text-align: center;"><span face="標楷體" style="font-size: x-small; mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";"><h1 style="text-align: left;"><span face="標楷體" style="font-size: x-large; mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">原子操作(atomic operations)</span></h1><p class="MsoNormal" style="font-size: medium; mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;">Open Roberta(<a href="https://lab.open-roberta.org">https://lab.open-roberta.org</a>) 的程式積木中,<a href="https://blogger.googleusercontent.com/img/a/AVvXsEj1DqJ96n4-ZFu1TH2JuJsQIX4Qoipe6_ZL4UdxnWogmvJl3YRGImNCxVOZPgxB63DXzmYSCvW0jVzMJ4jY4fASUPcjK78yrdlbuZ4s8Mx2hysGSLd-F9bwQFgaKFkk9xUpjzOIYQp7CRw_KdJK0C_8Hgofa0fDt1A05if33nTw3a_eOKdtn2747g" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="67" data-original-width="305" height="44" src="https://blogger.googleusercontent.com/img/a/AVvXsEj1DqJ96n4-ZFu1TH2JuJsQIX4Qoipe6_ZL4UdxnWogmvJl3YRGImNCxVOZPgxB63DXzmYSCvW0jVzMJ4jY4fASUPcjK78yrdlbuZ4s8Mx2hysGSLd-F9bwQFgaKFkk9xUpjzOIYQp7CRw_KdJK0C_8Hgofa0fDt1A05if33nTw3a_eOKdtn2747g=w200-h44" width="200" /></a>是控制前進/後退的積木,速度從 0~100%,移動距離以公分為單位。</p><p class="MsoNormal" style="font-size: medium; mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEgA5APBm4W4Gnk5dfPgXZGAB14Zhd-Tjh0JLYdwkZkwitBdznji_2FHrhRs6IpXQ0YWAEZ_SfMEHfNG4dNobltCL8UqqTid1WWd4hN5RpBS0jodp2T9wX0N5Yu6W8Qx3ZoE0-ycvbaCoi1huBj5SbAQ54HEyh_iStNfv-UaBaP3rUXUSWUuswKFFA" style="margin-left: 1em; margin-right: 1em; text-align: center; text-indent: 24pt;"><img alt="" data-original-height="67" data-original-width="266" height="51" src="https://blogger.googleusercontent.com/img/a/AVvXsEgA5APBm4W4Gnk5dfPgXZGAB14Zhd-Tjh0JLYdwkZkwitBdznji_2FHrhRs6IpXQ0YWAEZ_SfMEHfNG4dNobltCL8UqqTid1WWd4hN5RpBS0jodp2T9wX0N5Yu6W8Qx3ZoE0-ycvbaCoi1huBj5SbAQ54HEyh_iStNfv-UaBaP3rUXUSWUuswKFFA=w200-h51" width="200" /></a>是控制左/右轉的積木,以角度值來轉動。</p><p class="MsoNormal" style="font-size: medium; mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjdhQPonLo_OeAI2L1wSaiJD0iCBgFldG6Or7O8RseI4iOiSkbQxoB68vijIBI-eECOjO4HE-kl2Y4axJMhcbq3zNIVe1iRTH5lszPPHwj7mk1ZBkEOKbaGiUcXSkzO1H89Pm4cxfTD4fUUvWjuArlaZyEFZTFdB_TGxnK56LBzc2QEppAyLU_cwg" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="35" data-original-width="340" height="21" src="https://blogger.googleusercontent.com/img/a/AVvXsEjdhQPonLo_OeAI2L1wSaiJD0iCBgFldG6Or7O8RseI4iOiSkbQxoB68vijIBI-eECOjO4HE-kl2Y4axJMhcbq3zNIVe1iRTH5lszPPHwj7mk1ZBkEOKbaGiUcXSkzO1H89Pm4cxfTD4fUUvWjuArlaZyEFZTFdB_TGxnK56LBzc2QEppAyLU_cwg=w200-h21" width="200" /></a>是顏色感測器的讀值積木。</p><p class="MsoNormal" style="font-size: medium; mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;">透過這三個原子操作及<b>結構化程式設計(structural programming)</b>的<b>循序(sequential)</b>與<b>選擇(selective)</b>結構就能撰寫出本問題的完整程式了。<br /></p><p class="MsoNormal" style="font-size: medium; mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;"><br /></p></span></div><div style="text-align: center;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";"><h1 style="text-align: left;"><span face="標楷體" style="font-size: x-large; mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">積木組合</span></h1><p class="MsoNormal" style="font-size: medium; mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;">為了簡化感測器感測南北向的白色斑馬線,我們將圖 2 的背景圖加上白色的長方形色塊<a href="https://blogger.googleusercontent.com/img/a/AVvXsEj58d1lpgTStHYdQmJMlygM1JSVwb2ddZ70TpiY7Ds0ZmzB_Zh9hpKkAGRYEOqj47D4rL87mTMnRxKBup-zE1vfACxEDBsTEPD2QxznIhDOyeyP3bLd8grEZuaQdxRak06A-HY8RE_VTXqru9FLnUBbxOuR2ZuZ6XpF4B-SPY0ZzifTqWOpxqtXGw" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="59" data-original-width="59" height="43" src="https://blogger.googleusercontent.com/img/a/AVvXsEj58d1lpgTStHYdQmJMlygM1JSVwb2ddZ70TpiY7Ds0ZmzB_Zh9hpKkAGRYEOqj47D4rL87mTMnRxKBup-zE1vfACxEDBsTEPD2QxznIhDOyeyP3bLd8grEZuaQdxRak06A-HY8RE_VTXqru9FLnUBbxOuR2ZuZ6XpF4B-SPY0ZzifTqWOpxqtXGw=w43-h43" width="43" /></a>,並將之放在圖 3 中的適當位置(完整的設定檔 TrafficSafty.json 可以從<a href="https://reurl.cc/ZXvpdp">https://reurl.cc/ZXvpdp</a> 下載)。其中,車子的初始位置亦已設定完畢。</p><p class="MsoNormal" style="font-size: medium; mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;">最後,完整的控制程式 TrafficSafty.xml 如圖 5 所示,讀者們可以從 <a href="https://reurl.cc/7Rm5xd">https://reurl.cc/7Rm5xd</a> 下載。而程式的執行動畫如圖 6。註,需要反覆測試程式時,請按<a href="https://blogger.googleusercontent.com/img/a/AVvXsEht827XNmLblpUfWxZqK5Hw0ca1cNT32gv1qBTXARZLPZxE2gINUc7U_dLgJVFMiVv533KheGADIj3rOfU99YXPLa-cV3jPS_kSAYPFxh5Le8Ls5sXGVAGvgYPttnZEQHOZdrP0Wh41aJCne6OA7tUCsH3J1AmfCiWv_GsaHrG9DHCb0nqMVSCFrw" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="53" data-original-width="53" height="39" src="https://blogger.googleusercontent.com/img/a/AVvXsEht827XNmLblpUfWxZqK5Hw0ca1cNT32gv1qBTXARZLPZxE2gINUc7U_dLgJVFMiVv533KheGADIj3rOfU99YXPLa-cV3jPS_kSAYPFxh5Le8Ls5sXGVAGvgYPttnZEQHOZdrP0Wh41aJCne6OA7tUCsH3J1AmfCiWv_GsaHrG9DHCb0nqMVSCFrw=w39-h39" width="39" /></a>按鈕歸位。<br /></p><p class="MsoNormal" style="font-size: medium; mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;"><br /></p></span></div><p><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><o:p></o:p></span></p><div style="mso-element: footnote-list;"><div style="text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEgBUx0j_gcUPJ9qdK91P8rsUjCeZrkaWbIwiNggUhjpt0bS3jdLg8aZT9Bklwkd3j4TxLck6l0kwTU_7_CGL5xT30a44L08Mc0Os1rBkfjMEp0_k-RoRSnecdXI5B5nOtt9xKklgzvsV-BLiFRDmkIKJxNXnuolRcv5PwlaBHf9wTQd7rQn82IsTA" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="563" data-original-width="537" height="400" src="https://blogger.googleusercontent.com/img/a/AVvXsEgBUx0j_gcUPJ9qdK91P8rsUjCeZrkaWbIwiNggUhjpt0bS3jdLg8aZT9Bklwkd3j4TxLck6l0kwTU_7_CGL5xT30a44L08Mc0Os1rBkfjMEp0_k-RoRSnecdXI5B5nOtt9xKklgzvsV-BLiFRDmkIKJxNXnuolRcv5PwlaBHf9wTQd7rQn82IsTA=w382-h400" width="382" /></a></div><span style="font-size: x-small;">圖 5:完整程式碼</span></div><div style="text-align: center;"><br /></div><div style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiV3zVKZOrhUrzDLHNumwRUKM9cwDiB_-Ym-dqeonREODewpbJTJhM4sbevK6Bpu-wUGLeJ_BJHE4nx9ThmuSRplxwmCAC9yP_JiqK15SyeCoCiHpxTb7yVOVFbEbZn6UbV_53h3aHNlwILRwaGE3NUWKU8SI6aiHHWGbRcLpVhHiF14dfhbs-80A/s905/TrafficSafty.gif" style="font-family: times, "times new roman", serif; font-size: 13.2px; margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="592" data-original-width="905" height="261" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiV3zVKZOrhUrzDLHNumwRUKM9cwDiB_-Ym-dqeonREODewpbJTJhM4sbevK6Bpu-wUGLeJ_BJHE4nx9ThmuSRplxwmCAC9yP_JiqK15SyeCoCiHpxTb7yVOVFbEbZn6UbV_53h3aHNlwILRwaGE3NUWKU8SI6aiHHWGbRcLpVhHiF14dfhbs-80A/w400-h261/TrafficSafty.gif" width="400" /></a></div><div style="text-align: center;"><span style="font-size: x-small;">圖 6:執行結果動畫</span></div><div style="text-align: center;"><span style="font-size: x-small;"><br /></span></div><div style="text-align: center;"><span style="font-size: x-small;"><br /></span></div><div style="text-align: justify;"><span>註:一開始使用 Open Roberta 時可以先註冊個人帳號,這樣我們寫過的專案都會自動存在自己的帳號之內。此外,Open Roberta 是一個支援多款機器人主機的開發平台,本文使用的是樂高 EV3 的模擬器,請依照圖 7 的方式先行選定。</span></div><div style="text-align: center;"><span style="font-size: x-small;"><br /></span></div><div style="text-align: center;"><span style="font-size: x-small;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEgdf9X9UWdjHFVU-ZXlsRjw_2UWWMTa32HWnIbtFmn8_0Oxg-eFOf42mto8Qduljim8mQe0142A1oGaPvdjkFDXn5WYmpXyK1aWZFhIoVyXJv9EfNrCLIXxHpVUhs3WfNkI4Iy3XU1ynubYEgJmqu-hf7RIvhgtcgkH01wfRycDxL3EYNhg9sLfFQ" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="621" data-original-width="1011" height="394" src="https://blogger.googleusercontent.com/img/a/AVvXsEgdf9X9UWdjHFVU-ZXlsRjw_2UWWMTa32HWnIbtFmn8_0Oxg-eFOf42mto8Qduljim8mQe0142A1oGaPvdjkFDXn5WYmpXyK1aWZFhIoVyXJv9EfNrCLIXxHpVUhs3WfNkI4Iy3XU1ynubYEgJmqu-hf7RIvhgtcgkH01wfRycDxL3EYNhg9sLfFQ=w640-h394" width="640" /></a></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEhsFAvXYFgsRQ9os1Q-WbVOvb6II7WOg029REubUQfMNs3ekX-Kf_jRUMYuk-ExF0x4G0M1OIYIaGlMWkb7o5Tk4yDghUradPwGZJxisuUGsQScPRIWAI1CTJJWxx7DZ8qqyCkOe5vovHJMnQMbrkHj098V9srtTKZbfNWaRwE5jF1Zhc4hnFtZnw" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="955" data-original-width="1015" height="602" src="https://blogger.googleusercontent.com/img/a/AVvXsEhsFAvXYFgsRQ9os1Q-WbVOvb6II7WOg029REubUQfMNs3ekX-Kf_jRUMYuk-ExF0x4G0M1OIYIaGlMWkb7o5Tk4yDghUradPwGZJxisuUGsQScPRIWAI1CTJJWxx7DZ8qqyCkOe5vovHJMnQMbrkHj098V9srtTKZbfNWaRwE5jF1Zhc4hnFtZnw=w640-h602" width="640" /></a></div>圖 7:機器人主機設定<br /><br /></div></span></div><div style="text-align: center;"><span style="font-size: x-small;"><h1 style="text-align: left;"><span face="標楷體" style="font-size: x-large; mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">教學小幫手</span></h1><p class="MsoNormal" style="font-size: medium; mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;">為了將本文的 Open Roberta 專案融入「交通安全」教育以期能達到<span style="background-color: white;">「禮讓行人,行車安全」的教學願景(vision),</span><span style="text-indent: 24pt;">我們也設計了教案和(圖 8)和學習單(圖 9)供讀者們參考。</span></p></span></div><div style="text-align: center;"><span style="font-size: x-small;"><br /></span></div><div style="text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgB_yO4Ilg-ZwJBPUWFGeLu07cYZ6vbk4U9IIUPEYjEaLBmxDwIJ79tEVHnOI1yCLDY7AUH5LIPUVaSjystO8JoTbzO5s_yRFqK-2YQbaEztcdk5IpD5jpz_5e4wde4s6ekKy6czedUBwVEANlHbZpaDnXpCWW5eUXtWCvtA65-CF_B_wuVH1I4RA/s2339/%E8%B3%87%E7%A7%91%E6%95%99%E6%A1%88%E2%94%80%E9%81%8B%E7%AE%97%E6%80%9D%E7%B6%AD%E8%9E%8D%E5%85%A5%E4%BA%A4%E9%80%9A%E5%AE%89%E5%85%A8_04102023_print_Page_1.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="2339" data-original-width="1654" height="640" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgB_yO4Ilg-ZwJBPUWFGeLu07cYZ6vbk4U9IIUPEYjEaLBmxDwIJ79tEVHnOI1yCLDY7AUH5LIPUVaSjystO8JoTbzO5s_yRFqK-2YQbaEztcdk5IpD5jpz_5e4wde4s6ekKy6czedUBwVEANlHbZpaDnXpCWW5eUXtWCvtA65-CF_B_wuVH1I4RA/w453-h640/%E8%B3%87%E7%A7%91%E6%95%99%E6%A1%88%E2%94%80%E9%81%8B%E7%AE%97%E6%80%9D%E7%B6%AD%E8%9E%8D%E5%85%A5%E4%BA%A4%E9%80%9A%E5%AE%89%E5%85%A8_04102023_print_Page_1.jpg" width="453" /></a></div><br /><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiyylZnZDdultKkHd3E7OsegJt6fx4MlTuOWQv_8WmIFuj5WkpCKXBdkBiGJH_vI5OzbcBvVOtF9MPGhStjtVSQdVSeS4nhffuijj-w6qMuWiOVsCx2mP2EbQV39nSTzp-6iV9LTlJtpMe7nr0DOZV1aegpwI3XMo9WF4mAmxQxf3PK67YB4XV8gA/s2339/%E8%B3%87%E7%A7%91%E6%95%99%E6%A1%88%E2%94%80%E9%81%8B%E7%AE%97%E6%80%9D%E7%B6%AD%E8%9E%8D%E5%85%A5%E4%BA%A4%E9%80%9A%E5%AE%89%E5%85%A8_04102023_print_Page_2.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="2339" data-original-width="1654" height="640" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiyylZnZDdultKkHd3E7OsegJt6fx4MlTuOWQv_8WmIFuj5WkpCKXBdkBiGJH_vI5OzbcBvVOtF9MPGhStjtVSQdVSeS4nhffuijj-w6qMuWiOVsCx2mP2EbQV39nSTzp-6iV9LTlJtpMe7nr0DOZV1aegpwI3XMo9WF4mAmxQxf3PK67YB4XV8gA/w452-h640/%E8%B3%87%E7%A7%91%E6%95%99%E6%A1%88%E2%94%80%E9%81%8B%E7%AE%97%E6%80%9D%E7%B6%AD%E8%9E%8D%E5%85%A5%E4%BA%A4%E9%80%9A%E5%AE%89%E5%85%A8_04102023_print_Page_2.jpg" width="452" /></a></div><br /><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJgAGVqN5Lgr2VA9rGBYDkfZAh2WCzy3efRPfA7jfndPocc2S2yntrIZB55GnO6iY1Fu6i15Wtu0k46e2uWUJtQ3OdonUnNMq9f8v-kK8UxhWpYQCgM2BPHqITae-S0rFoRep4hgSXDyv5XLl6tSe4tQx7i7VJFa0nz_IHB1XfdJavqOJbFCvMWg/s2339/%E8%B3%87%E7%A7%91%E6%95%99%E6%A1%88%E2%94%80%E9%81%8B%E7%AE%97%E6%80%9D%E7%B6%AD%E8%9E%8D%E5%85%A5%E4%BA%A4%E9%80%9A%E5%AE%89%E5%85%A8_04102023_print_Page_3.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="2339" data-original-width="1654" height="640" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJgAGVqN5Lgr2VA9rGBYDkfZAh2WCzy3efRPfA7jfndPocc2S2yntrIZB55GnO6iY1Fu6i15Wtu0k46e2uWUJtQ3OdonUnNMq9f8v-kK8UxhWpYQCgM2BPHqITae-S0rFoRep4hgSXDyv5XLl6tSe4tQx7i7VJFa0nz_IHB1XfdJavqOJbFCvMWg/w452-h640/%E8%B3%87%E7%A7%91%E6%95%99%E6%A1%88%E2%94%80%E9%81%8B%E7%AE%97%E6%80%9D%E7%B6%AD%E8%9E%8D%E5%85%A5%E4%BA%A4%E9%80%9A%E5%AE%89%E5%85%A8_04102023_print_Page_3.jpg" width="452" /></a></div><br /><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjfrjX-cNO28jao5i91cFRfAvCpnubz-0KwyJHMCKxQNXw_dKXrHYrOKXkG9dVxW-ewxWzfqle4nSKgaB6kTpwVuH9Gu1Adon8cawJrb6E4VSXFLFTfGuiKllE4EfMDgsUSHDNhGFn92GQKI3huSSppqXbnUiNBl2NsYuyrrMpc5kU7lGn31T05jA/s2339/%E8%B3%87%E7%A7%91%E6%95%99%E6%A1%88%E2%94%80%E9%81%8B%E7%AE%97%E6%80%9D%E7%B6%AD%E8%9E%8D%E5%85%A5%E4%BA%A4%E9%80%9A%E5%AE%89%E5%85%A8_04102023_print_Page_4.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="2339" data-original-width="1654" height="640" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjfrjX-cNO28jao5i91cFRfAvCpnubz-0KwyJHMCKxQNXw_dKXrHYrOKXkG9dVxW-ewxWzfqle4nSKgaB6kTpwVuH9Gu1Adon8cawJrb6E4VSXFLFTfGuiKllE4EfMDgsUSHDNhGFn92GQKI3huSSppqXbnUiNBl2NsYuyrrMpc5kU7lGn31T05jA/w452-h640/%E8%B3%87%E7%A7%91%E6%95%99%E6%A1%88%E2%94%80%E9%81%8B%E7%AE%97%E6%80%9D%E7%B6%AD%E8%9E%8D%E5%85%A5%E4%BA%A4%E9%80%9A%E5%AE%89%E5%85%A8_04102023_print_Page_4.jpg" width="452" /></a></div><span style="font-size: x-small;">圖 8:教案</span></div><div style="text-align: center;"><br /><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkDygLf2ThFB4M3ev34929zd1kVRXf9-MiqmChIe8SPYmI4B-g9iAwBv7HwlF-wkDSSVj-1-djlKV-hW8RZftCsdthIDvIHpHkjSOxaYCCxR-9i_TpX5gf840N1JUoMZ8v3lfHTDNrozA1aUo03q5jKmcxgB54wn4vl0TCss48DNe0B3cgpqNllg/s1953/%E9%81%8B%E7%AE%97%E6%80%9D%E7%B6%AD%E8%9E%8D%E5%85%A5%E4%BA%A4%E9%80%9A%E5%AE%89%E5%85%A8%20%E5%AD%B8%E7%BF%92%E5%96%AE.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="1953" data-original-width="1381" height="640" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkDygLf2ThFB4M3ev34929zd1kVRXf9-MiqmChIe8SPYmI4B-g9iAwBv7HwlF-wkDSSVj-1-djlKV-hW8RZftCsdthIDvIHpHkjSOxaYCCxR-9i_TpX5gf840N1JUoMZ8v3lfHTDNrozA1aUo03q5jKmcxgB54wn4vl0TCss48DNe0B3cgpqNllg/w452-h640/%E9%81%8B%E7%AE%97%E6%80%9D%E7%B6%AD%E8%9E%8D%E5%85%A5%E4%BA%A4%E9%80%9A%E5%AE%89%E5%85%A8%20%E5%AD%B8%E7%BF%92%E5%96%AE.jpg" width="452" /></a></div><div class="separator" style="clear: both; text-align: center;"><span style="font-size: x-small;">圖 9:學習單</span></div><div class="separator" style="clear: both; text-align: center;"><span style="font-size: x-small;"><br /></span></div><div class="separator" style="clear: both; text-align: justify;"><span style="font-size: x-small;">筆者針對本文的教學翦影如圖 10 所示。</span></div><div class="separator" style="clear: both; text-align: justify;"><span style="font-size: x-small;"><br /></span></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2epIgNMItMUyaWn2td1dp1CcTC9ouJHxHQcJoPvOZfc-hQW710e2W1YjBoMrKtv1DIVXlQGAVm-85NuyWR8NaXu6ceZFif1Kb5ptFilQDJ9Pwvt_ss7xSzo5yeFOMMZan-btIZzPBKDomopbwxNL1rqbtdgizdNcS4mX9PtRPnyejyKvwQHzFrw/s1280/LINE_ALBUM_1120410%E8%B3%87%E7%A7%91%E6%8E%88%E8%AA%B2_230411_3.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="721" data-original-width="1280" height="180" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2epIgNMItMUyaWn2td1dp1CcTC9ouJHxHQcJoPvOZfc-hQW710e2W1YjBoMrKtv1DIVXlQGAVm-85NuyWR8NaXu6ceZFif1Kb5ptFilQDJ9Pwvt_ss7xSzo5yeFOMMZan-btIZzPBKDomopbwxNL1rqbtdgizdNcS4mX9PtRPnyejyKvwQHzFrw/s320/LINE_ALBUM_1120410%E8%B3%87%E7%A7%91%E6%8E%88%E8%AA%B2_230411_3.jpg" width="320" /></a></div><br /><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwpe2gFVS-_5PVex7yEB7HJVxk3zw5AyZzcM8cNBilduQE-TXxwc2SkIg1JOUpUgJ1AQUILe2if85OR5T3FvpWyzpfbDANote9yWFCTtvyDKlL-teiu-tm8kghaHauuDSs9CQZZHpQBt_Eg4UYJA2Qnjj3DPfvqdpFOkT5mAm5tg4CGgHcFkUXwg/s1280/LINE_ALBUM_1120410%E8%B3%87%E7%A7%91%E6%8E%88%E8%AA%B2_230411_7.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="721" data-original-width="1280" height="180" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwpe2gFVS-_5PVex7yEB7HJVxk3zw5AyZzcM8cNBilduQE-TXxwc2SkIg1JOUpUgJ1AQUILe2if85OR5T3FvpWyzpfbDANote9yWFCTtvyDKlL-teiu-tm8kghaHauuDSs9CQZZHpQBt_Eg4UYJA2Qnjj3DPfvqdpFOkT5mAm5tg4CGgHcFkUXwg/s320/LINE_ALBUM_1120410%E8%B3%87%E7%A7%91%E6%8E%88%E8%AA%B2_230411_7.jpg" width="320" /></a></div><br /><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglqqYzcBmmJrEmv13CwEUw-i48u3MNwMNl_kys4F5dSBWfq5c7gmcEoZ-i69-yWufOlYx2VQbLLmfj4H_KaO71dIzIXMN22LbM9_RTPYPF95s0MgbZZlM7Dg3gaoLtyBI051Sk5Bi2PxTVCHRYAjwDS0uBCAFzkA8vXb5AjkjA551uc0DPPu-gIA/s1280/LINE_ALBUM_1120410%E8%B3%87%E7%A7%91%E6%8E%88%E8%AA%B2_230411_15.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="721" data-original-width="1280" height="180" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglqqYzcBmmJrEmv13CwEUw-i48u3MNwMNl_kys4F5dSBWfq5c7gmcEoZ-i69-yWufOlYx2VQbLLmfj4H_KaO71dIzIXMN22LbM9_RTPYPF95s0MgbZZlM7Dg3gaoLtyBI051Sk5Bi2PxTVCHRYAjwDS0uBCAFzkA8vXb5AjkjA551uc0DPPu-gIA/s320/LINE_ALBUM_1120410%E8%B3%87%E7%A7%91%E6%8E%88%E8%AA%B2_230411_15.jpg" width="320" /></a></div><span style="font-size: x-small;">圖 10:教學翦影</span><span style="font-size: x-small;"><br /></span></div></div><div style="text-align: center;"><span style="font-size: x-small;"><br /></span></div><div style="text-align: center;"><span style="font-size: x-small;"><h1 style="text-align: left;"><span face="標楷體" style="font-size: x-large; mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">後敘</span></h1><p class="MsoNormal" style="font-size: medium; mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;">喜歡動手做的讀者們可以先以<b>設計思考(design thinking)</b>的方法設計出自己的實體自走車後,再運用本文介紹的運算思維設計出自走車的機電整合控制程式試試。</p></span></div><hr align="left" size="1" width="33%" /><!--[endif]--><div id="ftn1" style="mso-element: footnote;"><div style="text-align: justify;"><span style="font-size: x-small;">[1] 感謝林汶忠老師提供協助。</span></div><div style="text-align: justify;"><span style="font-size: x-small;">[2] <a href="http://creativecommons.tw/explore" style="color: #2288bb; font-family: times, "times new roman", serif; text-decoration-line: none;" target="_blank">六種授權條款</a><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;">。</span></span></div></div></div>Ted Leehttp://www.blogger.com/profile/03077454870590095355noreply@blogger.com0tag:blogger.com,1999:blog-1468347421357730785.post-81697139163801020672023-03-11T07:18:00.016+08:002023-03-12T07:20:52.630+08:00[app, Thunkable, flowchart] 從流程圖到 Thunkable app_2:計算長方形面積<h1 style="text-align: center;"> <span style="font-size: xx-large; text-align: center;">從流程圖到 Thunkable app_2:</span></h1><h1 style="text-align: center;"><span style="font-size: x-large;">計算長方形面積</span></h1><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><a href="https://www.facebook.com/groups/134149180510967/" style="color: #2288bb; text-decoration-line: none;" target="_blank"><span style="font-family: times, "times new roman", serif;">Ted Lee的土饅頭(To Mentor)工坊</span></a></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><div><span style="font-family: times, "times new roman", serif;">Line:ted2016.kpvs</span><br /><span style="font-family: times, "times new roman", serif;">Email:Lct4246@gmail.com</span><br /><span style="font-family: times, "times new roman", serif;"><span style="font-family: "times new roman", serif;">FB</span>:<span style="font-family: "times new roman", serif;">http://gg.gg/</span><span style="color: #00cc00; font-family: "times new roman", serif;">TedLee</span><span style="color: red; font-family: "times new roman", serif;">FB</span><span style="font-family: "times new roman", serif;">/</span></span></div><div><span lang="" style="font-family: times, "times new roman", serif; font-size: 12pt;">Blog<span style="font-family: "times new roman"; font-size: small;">:</span>http://gg.gg/<span style="color: #00cc00;">TedLee</span><span style="color: red;">Blog</span>/</span><br /></div></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><span style="font-family: times, "times new roman", serif;"><br /></span></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><span style="font-family: times, "times new roman", serif;">Mar. 11, 2023</span></div><div style="text-align: center;"><span><span style="color: #222222; font-family: times, "times new roman", serif;"><span style="font-size: 13.2px;"><div class="separator" style="clear: both;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s88/CC.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="31" data-original-width="88" height="31" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s1600/CC.png" width="88" /></a>[1]</div><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjGF1cvEVcLuugfxR59yiSXdy8MPQU-QOyF5tTxW4TcJjJwzr0QQrSjQm4sf_40PDYYFXRrbFSgQWuCOEgPywLVMrjNEyoT21t1A_gpeAIAWDUCzN-KI6SQoCjCy3ymfn06cFCBo3VZxcvpc2OUL-6MeGfKHnI4Xu6EhHRiD7P6F1CzroEyXxKeZg" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="615" data-original-width="358" height="400" src="https://blogger.googleusercontent.com/img/a/AVvXsEjGF1cvEVcLuugfxR59yiSXdy8MPQU-QOyF5tTxW4TcJjJwzr0QQrSjQm4sf_40PDYYFXRrbFSgQWuCOEgPywLVMrjNEyoT21t1A_gpeAIAWDUCzN-KI6SQoCjCy3ymfn06cFCBo3VZxcvpc2OUL-6MeGfKHnI4Xu6EhHRiD7P6F1CzroEyXxKeZg=w234-h400" width="234" /></a></div></div><div class="separator" style="clear: both;"><br /></div></span></span></span></div><div style="background: white; text-align: justify; text-indent: 24pt;"><span style="text-indent: 24pt;"><div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; text-indent: 24pt;">當雲端的新服務<b>發佈(publish)</b>後沒多久,透過 <b>API(Application Programming Interface)</b>呼叫,App 版的介面也會很快的發行。舉例來說,ChatGPT 在 2022 年 11 月上線後,對應的 apps 在近期也可以陸陸續續從 app <b>市集(markets)</b>上下載到。因此,<span style="text-indent: 24pt;">雲端</span><span style="text-indent: 24pt;">服務</span><span style="text-indent: 24pt;">同時能提供網頁和 app 形式來連接已成為現今最主流的雙介面</span><span style="text-indent: 24pt;">。</span></div><div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; text-indent: 24pt;">另一方面,行動載具採 <b>MVC(Model View Controller)</b>設計概念,分成畫面設計<a href="https://blogger.googleusercontent.com/img/a/AVvXsEj0DfZw4_yiUNJXIyCL_8ETn_1dA3gsudlsqLP1jDxnzUVk2W_zi_2L6VvwzGsIkFxEdOkT5WM5jV9-3lCtZ2iuEKrrQu3GnaQTt8CJUNpIUfMg1FQ0YHpz-cErlKtUcwaugvB3FrY6NKV07ry9eE0nU0ocZVp5BZnOkhlDWhOTdAk0XPDp3M54MA" style="margin-left: 1em; margin-right: 1em; text-align: center; text-indent: 24pt;"><img alt="" data-original-height="22" data-original-width="55" height="44" src="https://blogger.googleusercontent.com/img/a/AVvXsEj0DfZw4_yiUNJXIyCL_8ETn_1dA3gsudlsqLP1jDxnzUVk2W_zi_2L6VvwzGsIkFxEdOkT5WM5jV9-3lCtZ2iuEKrrQu3GnaQTt8CJUNpIUfMg1FQ0YHpz-cErlKtUcwaugvB3FrY6NKV07ry9eE0nU0ocZVp5BZnOkhlDWhOTdAk0XPDp3M54MA=w111-h44" width="111" /></a>和程式設計<a href="https://blogger.googleusercontent.com/img/a/AVvXsEiSQ7xuTiSDesKXHtX0JNKpIIL-LR9fSY1O9da5FL8QynZXW1ykswWYDS6DXagA8Y_kgBZBTLv0OMlBaTHRhUlsRAAcieYeu83DsR5T_w4ws3wpGwAr_gHW-BBaTTZX7ti5sx9_4SSC6Xncz2GlIRJ1XMJ7f1ttcfP2kKPA5iO6B_NmVNh5_y-VEg" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="21" data-original-width="52" height="40" src="https://blogger.googleusercontent.com/img/a/AVvXsEiSQ7xuTiSDesKXHtX0JNKpIIL-LR9fSY1O9da5FL8QynZXW1ykswWYDS6DXagA8Y_kgBZBTLv0OMlBaTHRhUlsRAAcieYeu83DsR5T_w4ws3wpGwAr_gHW-BBaTTZX7ti5sx9_4SSC6Xncz2GlIRJ1XMJ7f1ttcfP2kKPA5iO6B_NmVNh5_y-VEg=w98-h40" width="98" /></a>兩個階段。<span style="text-indent: 24pt;">本文先說明要解決的問題,再將它的解題步驟匯整為陳會安老師設計的 fChart 流程圖。最後再著手設計 app 的呈現畫面及其背後的控制程式。</span></div></span></div><div style="text-align: center;"><br /></div><div style="text-align: center;"><h1 style="text-align: left;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">問題說明</span></h1><div style="background: white; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;">由鍵盤輸入長方形的寬,並自動計算其面積。</div><div style="background: white; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;">陳會安老師提供了本問題的解決流程如圖 2 所示。首先,設定好長方形的高 height 為 135。接著,讀取輸入的寬 width。最後,計算其面積 area,並將之顯示在畫面上。</div><div style="background: white; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;"><br /></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEhhGXXi_rsZnGIiFkKL28rmJqk4TZ0BL6UNsmoPPGEBen5tvfeaQh9HLK2UBBQ2Q6rF-QCN9hVvkmyo5T5VJcF6HMNKgqGFHb7WZKLG6qwMY1eSRL6C0QyUaW5J40CTEzhrUc5MY9N-OgtCekGtkV6o2yk090_X-NV761oaQI29l_45obh6TPgTbw" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="505" data-original-width="265" height="400" src="https://blogger.googleusercontent.com/img/a/AVvXsEhhGXXi_rsZnGIiFkKL28rmJqk4TZ0BL6UNsmoPPGEBen5tvfeaQh9HLK2UBBQ2Q6rF-QCN9hVvkmyo5T5VJcF6HMNKgqGFHb7WZKLG6qwMY1eSRL6C0QyUaW5J40CTEzhrUc5MY9N-OgtCekGtkV6o2yk090_X-NV761oaQI29l_45obh6TPgTbw=w210-h400" width="210" /></a></div></div><div class="separator" style="clear: both;"><span style="font-size: x-small;">圖 1:長方形面積的計算流程</span></div><div class="separator" style="clear: both;"><br /></div></div><div style="text-align: center;"><h1 style="text-align: left;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">畫面設計</span></h1><div style="background: white; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;"><span style="text-indent: 24pt;">畫面的安排如圖 2 所示,我們使用馬 3 個 Label 和 1 個 Text Input 元件。</span></div></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: justify;"><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEiOUBPLkvjURL6ofA-948eSPxBjhoPL9Zc0VRJwO6Q91WCA7u1dt_dEol7yOb1Nx24duExojWNkLL2hfwogleKnMXq9xHYZLFjUob7NjnLBuqF2JUxKjPqgKRlVMVPvd0vzH2L1rfXZCdACOonIpatKupaDKsPJREiK3kpSmnp3eidrvSCmWE6M9g" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="593" data-original-width="338" height="400" src="https://blogger.googleusercontent.com/img/a/AVvXsEiOUBPLkvjURL6ofA-948eSPxBjhoPL9Zc0VRJwO6Q91WCA7u1dt_dEol7yOb1Nx24duExojWNkLL2hfwogleKnMXq9xHYZLFjUob7NjnLBuqF2JUxKjPqgKRlVMVPvd0vzH2L1rfXZCdACOonIpatKupaDKsPJREiK3kpSmnp3eidrvSCmWE6M9g=w228-h400" width="228" /></a></div></div><div class="separator" style="clear: both;"><span style="font-size: x-small;">圖 2:畫面設計圖</span></div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both; text-align: justify;">各元件的命名及其屬性設定詳列如圖 3。</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEh8vPmBygjNquG9KfNPOFRiLGHVD_t374Q7mSXTI3XOG8I0ZXlmsOY-s30HuAz5NS_5TrQbnhJQPDUQfo2FEbl354gFyeq5eLntPXj4ctqGfcDUhR3zDd6YPg_G2-pPdC0T8_aSKaE0aGrzFNv5tbooAKfBiNs_G8K_S4Ot_frhDa2D5gqThsAmnw" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="318" data-original-width="814" height="156" src="https://blogger.googleusercontent.com/img/a/AVvXsEh8vPmBygjNquG9KfNPOFRiLGHVD_t374Q7mSXTI3XOG8I0ZXlmsOY-s30HuAz5NS_5TrQbnhJQPDUQfo2FEbl354gFyeq5eLntPXj4ctqGfcDUhR3zDd6YPg_G2-pPdC0T8_aSKaE0aGrzFNv5tbooAKfBiNs_G8K_S4Ot_frhDa2D5gqThsAmnw=w400-h156" width="400" /></a> </div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjrkwonqgBqk7lVcrbGlMmYsrf6Lc55QI-gLks9f1zMpBPeC1UG_8u4iBixrdmUBSbUjjIAv20Njk75alZNPwhgwX_7jnS5I39ikqDybHGcE0voBCRl0vjNJD3oWZ5Y0OuVBQwY7ocN3oVJu57_jpKTjOe1D4K7dj1y_e8zzuu5T4SqRr8xvQU57w" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="210" data-original-width="196" height="240" src="https://blogger.googleusercontent.com/img/a/AVvXsEjrkwonqgBqk7lVcrbGlMmYsrf6Lc55QI-gLks9f1zMpBPeC1UG_8u4iBixrdmUBSbUjjIAv20Njk75alZNPwhgwX_7jnS5I39ikqDybHGcE0voBCRl0vjNJD3oWZ5Y0OuVBQwY7ocN3oVJu57_jpKTjOe1D4K7dj1y_e8zzuu5T4SqRr8xvQU57w" width="224" /></a></div></div><span style="font-size: x-small;">圖 3:各元件設定</span></div></div></div></div></div></div></div><div class="separator" style="clear: both;"><span style="background-color: white; text-indent: 32px;"><br /></span></div></div><h1>程式畫面</h1><p class="MsoNormal" style="mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;">在程式自動化方面,當我們輸入完長方形寬的大小後,按下 Enter 鍵或以滑鼠在空白處輕點一下(完成輸入)後會立即啟動 Submit(提交)事件。因此,我們將長方形的計算方式及結果輸出包在這個事件處理積木之內即可完成處理(圖 4)。</p><div style="text-align: center;"><br /></div><div style="text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjH6d2oQ5ihBqRktnvVp-mNmtuhGULFZOiXZiqnhkGQetMObkZoIYr2N9hhOIK0zH8JT9w2j236umbPq2KkWO-6d0I0bI9qFDecPdfBe-20L160yZGSpg6sdmWp4lIntq7Bs_tgpE9RO3vbaX3wuPavnSzQXNwE7RO7a27zelby4WFik0xvgdy4qQ" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="98" data-original-width="586" height="108" src="https://blogger.googleusercontent.com/img/a/AVvXsEjH6d2oQ5ihBqRktnvVp-mNmtuhGULFZOiXZiqnhkGQetMObkZoIYr2N9hhOIK0zH8JT9w2j236umbPq2KkWO-6d0I0bI9qFDecPdfBe-20L160yZGSpg6sdmWp4lIntq7Bs_tgpE9RO3vbaX3wuPavnSzQXNwE7RO7a27zelby4WFik0xvgdy4qQ=w640-h108" width="640" /></a></div></div><div style="text-align: center;"><span face="標楷體" style="font-size: x-small; mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">圖 4:積木程式</span></div><p><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><o:p></o:p></span></p><div style="mso-element: footnote-list;"><hr align="left" size="1" width="33%" /><!--[endif]--><div id="ftn1" style="mso-element: footnote;"><div style="text-align: justify;"><span style="font-size: x-small;">[1] <a href="http://creativecommons.tw/explore" style="color: #2288bb; font-family: times, "times new roman", serif; text-decoration-line: none;" target="_blank">六種授權條款</a><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;">。</span></span></div></div></div>Ted Leehttp://www.blogger.com/profile/03077454870590095355noreply@blogger.com0tag:blogger.com,1999:blog-1468347421357730785.post-41707239881644553122023-02-28T07:54:00.048+08:002023-03-01T11:50:54.768+08:00[app, Thunkable, flowchart] 從流程圖到 Thunkable app_1:加法<h1 style="text-align: center;"> <span style="font-size: x-large;">從流程圖到 Thunkable app_1:</span></h1><h1 style="text-align: center;"><span style="font-size: x-large;">加法</span></h1><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><a href="https://www.facebook.com/groups/134149180510967/" style="color: #2288bb; text-decoration-line: none;" target="_blank"><span style="font-family: times, "times new roman", serif;">Ted Lee的土饅頭(To Mentor)工坊</span></a></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><div><span style="font-family: times, "times new roman", serif;">Line:ted2016.kpvs</span><br /><span style="font-family: times, "times new roman", serif;">Email:Lct4246@gmail.com</span><br /><span style="font-family: times, "times new roman", serif;"><span style="font-family: "times new roman", serif;">FB</span>:<span style="font-family: "times new roman", serif;">http://gg.gg/</span><span style="color: #00cc00; font-family: "times new roman", serif;">TedLee</span><span style="color: red; font-family: "times new roman", serif;">FB</span><span style="font-family: "times new roman", serif;">/</span></span></div><div><span lang="" style="font-family: times, "times new roman", serif; font-size: 12pt;">Blog<span style="font-family: "times new roman"; font-size: small;">:</span>http://gg.gg/<span style="color: #00cc00;">TedLee</span><span style="color: red;">Blog</span>/</span><br /></div></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><span style="font-family: times, "times new roman", serif;"><br /></span></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><span style="font-family: times, "times new roman", serif;">Feb. 28, 2023</span></div><div style="text-align: center;"><span><span style="color: #222222; font-family: times, "times new roman", serif;"><span style="font-size: 13.2px;"><div class="separator" style="clear: both;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s88/CC.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="31" data-original-width="88" height="31" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s1600/CC.png" width="88" /></a>[1]</div><div class="separator" style="clear: both;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjN95Y3l2-LVIyQa4CXceFYViyI4r7wYuSw40MEFPtu8ddwismOFN2NvC3EDRtPQqx-xpGVZGXuUvadBjHd8zX_rXvpQRtNk7xc9ow9iYRdLLOR1mbu94v90Yz46HeHqEEm9R4cOfcbn-Q1IOG7ptYbg20LscDzAGRAlMsWnL29TlCVEpHDXW9G0Q/s861/Snap4.jpg" style="font-family: "Times New Roman"; font-size: medium; margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="861" data-original-width="494" height="640" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjN95Y3l2-LVIyQa4CXceFYViyI4r7wYuSw40MEFPtu8ddwismOFN2NvC3EDRtPQqx-xpGVZGXuUvadBjHd8zX_rXvpQRtNk7xc9ow9iYRdLLOR1mbu94v90Yz46HeHqEEm9R4cOfcbn-Q1IOG7ptYbg20LscDzAGRAlMsWnL29TlCVEpHDXW9G0Q/w368-h640/Snap4.jpg" width="368" /></a></div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"><br /></div></span></span></span></div><div style="background: white; text-align: justify; text-indent: 24pt;"><span style="text-indent: 24pt;"><div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; text-indent: 24pt;"><span style="text-indent: 24pt;">我們在這篇文章《從想法到實現:怎麼用程式解決問題?》(</span><a href="https://makerpro.cc/2021/11/use-program-to-solve-the-problem/?fbclid=IwAR1IJardO7dnuilPhRqG5KnpDG22hmOXFNpibOmUviqG3enxaxW_sUhEOXU" style="text-indent: 24pt;" target="_blank">https://reurl.cc/6NEG7d</a><span style="text-indent: 24pt;">)中已明確的指出:</span></div><p style="text-align: left; text-indent: 0px;"></p><div style="text-indent: 0px;"><div class="separator" style="clear: both; text-align: center;"><blockquote><b>流程圖(flowchart)</b>為程式邏輯之母</blockquote></div><div class="separator" style="clear: both;">將原始問題的一連串解決步驟表達成清晰、明確的解題流程之後,想要使用任何的程式語言來<b>實作(implement)</b>成軟體工具就變成「流程圖與程式語言」對應的轉換問題了。</div></div></span></div><div style="background: white; text-align: justify; text-indent: 24pt;"><span style="background-color: transparent;">本文以陳會安老師分享的 fChart+Thunkable 示例,詳細的解說 fChart(<a href="https://drive.google.com/file/d/18GlnhiEwbjuJN4cp27HFRRlVGxOkI6cD/view?usp=share_link" target="_blank">https://reurl.cc/gZ0rXV</a>)流程圖如何以手工方式(目前沒有流程圖自動轉成程式語言語法(syntax)的演算法)一一轉換為 Thunkable app 。</span></div><div style="text-align: justify;"><div class="separator" style="clear: both; text-align: justify;"><br /></div><div class="separator" style="clear: both; text-align: justify;"><ol><li>1_fChart_Blockly_Thunkable_基礎與程式邏輯(<a href="https://drive.google.com/file/d/1lW9Ho1VxXKH7x7BvCN2S_zz74tpvYDzG/view?fbclid=IwAR3HSmLX6NC3X5eAxlixJ8cP_b6ONqsM3l--E0WYN3q9-r6D1tNKZkRDrZU" target="_blank">https://reurl.cc/qkOp2p</a>)</li><li>2_fChart_Blockly_Thunkable_變數與運算子(循序結構)(<a href="https://drive.google.com/file/d/1TXy-uR4jUYo6TdYb2JPJlemGZnKM4GAy/view?fbclid=IwAR0S2uwiUleH_JAOEF-bdgI74e2wy32-irZ1rHfyFfMt9zKuXbsx9_1BP3A" target="_blank">https://reurl.cc/6NEGRV</a>)</li><li>3_fChart_Blockly_Thunkable_是否選(選擇結構)(<a href="https://drive.google.com/file/d/1MvagrSGHyy7cQpLKQI2Q5Bs35qFYXyGU/view?fbclid=IwAR0b56vjjPBE4Cfy5s4lcuF-G1D038Q1k5u7RxcutPnX8LsOrfneLB-__Og" target="_blank">https://reurl.cc/MRb2om</a>)</li><li>4_fChart_Blockly_Thunkable_二選一(選擇結構)(<a href="https://drive.google.com/file/d/1d0NqKy1uNVOS2Jzqr5zb7zBKci-rA7aA/view?fbclid=IwAR0ClHBDU1N4wzGIHc3Fqg-ig2s7iXk5Q6IeoJS6eLz1y0Vk7-lU2L5MNao" target="_blank">https://reurl.cc/pLWpbd</a>)</li><li>5_fChart_Blockly_Thunkable_多選一(選擇結構)(<a href="https://drive.google.com/file/d/1LNFGtNDwDuSlXRzvWk2rddgJWcAE7nBs/view?fbclid=IwAR0NAIT7G32b2DX-lFJX0kObnaRsNk_0b_C1YRsLSFJ06Hc5MGnJ0iNb79w" target="_blank">https://reurl.cc/DmdxMO</a>)</li><li>6_fChart_Blockly_Thunkable_迴圈(重複結構)(<a href="https://drive.google.com/file/d/105IKqoswUxqfIYUSH-2BWSFcWX04hAuv/view?fbclid=IwAR1tCNVHN_6Flg9qEBPkPPvl_n4RFJ_lXagxZdbva7dJ44IhcWtJsK11bkg" target="_blank">https://reurl.cc/mlGpbV</a>)</li><li>7_fChart_Blockly_Thunkable_函數(模組)(<a href="https://drive.google.com/file/d/1Ca3rga_DV0do2SOQFu_NAMbJjCN71e0S/view?fbclid=IwAR0e7QXFCzuupGJz8ds5V4REKywzBlS7_D_uP-N0_V58Yvofvg6FmJMcJNM" target="_blank">https://reurl.cc/AdK9ed</a>)</li><li>8_fChart_Blockly_Thunkable_清單(資料結構)(<a href="https://drive.google.com/file/d/1r7XTv4K4V33TcvozZQ97SpLJKEf8G6Zi/view?fbclid=IwAR2R_nlWSQkA2fKKJl-n0CjSLBdm-n6-hc0FMlPA0Dh-CshekDUTg66DVg0" target="_blank">https://reurl.cc/Nqp2mm</a>)</li><li>9_Thunkable多螢幕App開發(<a href="https://drive.google.com/file/d/1ZoFVdHHgjlRxxw9PyimZBK-0cs6gwjs4/view?fbclid=IwAR3c9XvTdw4eH-O3cEAJH-kUjxTh8Zr9EXGGnQOaM4liCrs8_g_LEWPzJec" target="_blank">https://reurl.cc/xlOWME</a>)</li><li>10_Thunkable跨平台行動開發(專案實例)(<a href="https://drive.google.com/file/d/1MDPPcWWWAVP8fkaRcTLKLYY6fW0DH2Da/view?fbclid=IwAR3NEdy3p7QXpHflXszh-eRZ4OjoT8d7a7BDnmZtdBUDTPQ58S-p0_RNrsQ" target="_blank">https://reurl.cc/qkOpRD</a>)</li></ol></div><div class="separator" style="clear: both; text-align: justify;"><div class="separator" style="clear: both; text-align: center;"><br /></div></div></div><div style="text-align: center;"><span style="background-color: white;"><h1 style="text-align: left;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">App 設計在 maker、IoT 上扮演的角色定位</span></h1><div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;"><span style="color: #333333; font-size: 16px; text-indent: 0px;">在筆者拙著《物聯網的兩種標準作業模式:地對雲與雲對地》(<a href="https://lct4246.blogspot.com/2017/07/tediotted.html" target="_blank">https://reurl.cc/xlOWrb</a>)一文中,從圖 1 中可以看出行動 Apps 扮演著兩種模式:<b>遠端監控(remote monitoring)</b>和<b>遠端顯示(remote display)</b>。</span></div></span></div><div style="text-align: center;"><br /></div><div style="text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijoR2gGa6y-SQHpNsJZggnBqUBFva5fjZJwzuTz8mtmqo_74AkFMmRoHXT6YVUbsdUT3VEDLF3VnCMzM4-LHKFgTvuPmJyHujztwt_UrUn9sZmCLQPzcCNsj2bZMN-on3m6MP5KHIY/s1600/%25E7%25B9%25AA%25E5%259C%25961.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="845" data-original-width="1600" height="338" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijoR2gGa6y-SQHpNsJZggnBqUBFva5fjZJwzuTz8mtmqo_74AkFMmRoHXT6YVUbsdUT3VEDLF3VnCMzM4-LHKFgTvuPmJyHujztwt_UrUn9sZmCLQPzcCNsj2bZMN-on3m6MP5KHIY/w640-h338/%25E7%25B9%25AA%25E5%259C%25961.jpg" width="640" /></a> <div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQPAddtxGjRQRh8HSBvEiWilPE3m79XtVK27cnUYnC-wmaKwtu2K-fXlfLzfinqZYdVlfC7odh3tU4qJ-3z40Ft-l4tEDLBduqEBrMs2DQcM9xYe9zHEogNtzT6pcbkr0DJWwNrMiY/s1600/%25E7%25B9%25AA%25E5%259C%25962.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="845" data-original-width="1600" height="338" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQPAddtxGjRQRh8HSBvEiWilPE3m79XtVK27cnUYnC-wmaKwtu2K-fXlfLzfinqZYdVlfC7odh3tU4qJ-3z40Ft-l4tEDLBduqEBrMs2DQcM9xYe9zHEogNtzT6pcbkr0DJWwNrMiY/w640-h338/%25E7%25B9%25AA%25E5%259C%25962.jpg" width="640" /></a></div></div><div class="separator" style="clear: both; text-align: center;"><span style="font-size: x-small;">圖 1:IoT 三大技術領域:邊緣運算、雲端服務與行動 Apps</span></div></div><div style="text-align: center;"><br /></div><div style="text-align: justify;">雖然目前 app 開發的市場已趨近飽和,像憤怒鳥 app 那樣一上架就萬人下載的榮景不再,不過 maker 或 IoT 創作者<b>客製化(customize)</b>成符合自己作品應用情境的版本仍是有其需求的。</div><div style="text-align: justify;">註:我們之所以挑選 Thunkable 做為 apps 開發的入門工具乃是因為它能同時支援 Android 與 iOS 軟硬體平台。</div><div style="text-align: center;"><br /></div><div style="text-align: center;"><h1 style="text-align: left;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">問題說明</span></h1><div style="background: white; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;">由鍵盤輸入兩數字,並顯示其和。</div><div style="background: white; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;">在圖 2 中,我們截取會安老師繪製的 fChart 流程圖來說明上述問題的四個解決步驟:輸入兩個數字 a 和 b、計算相加之和、顯示結果。</div><div style="background: white; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;"><br /></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEiv8PNZG-_2HclG2qymjO0fbznX8vB1PjOxqb1PmsHOgDklBworAXiDN0jisUL-6iAljGOgNvHkj3xEAsGXf8p6H7uTvbIv3meP4MA9DQgvr_uFg_GcvTuKpPJE7QUJqJT116WLcNloCFSjKYnpXgio7U0pULgbyanz1iCBDuy9uACggezXi_obzg" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="617" data-original-width="765" height="515" src="https://blogger.googleusercontent.com/img/a/AVvXsEiv8PNZG-_2HclG2qymjO0fbznX8vB1PjOxqb1PmsHOgDklBworAXiDN0jisUL-6iAljGOgNvHkj3xEAsGXf8p6H7uTvbIv3meP4MA9DQgvr_uFg_GcvTuKpPJE7QUJqJT116WLcNloCFSjKYnpXgio7U0pULgbyanz1iCBDuy9uACggezXi_obzg=w640-h515" width="640" /></a></div><div class="separator" style="clear: both; text-align: center;"><span style="font-size: x-small;">圖 2:兩數求和計算</span></div><div class="separator" style="clear: both; text-align: center;"><br /></div></div><div style="text-align: center;"><h1 style="text-align: left;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">App 設計邏輯:三區與二畫面</span></h1><div style="background: white; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;">apps 設計工具多半採用 <b>MVC(Mode-View-Controller,模型─視圖─控制器)</b>架構,圖 3 即為 Thunkable IDE 的三明治式執行畫面:左側為<b>元件(components)</b>區、中間為 UI 設計區,最右側為元件<b>屬性(properties)</b>區。</div><div style="background: white; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;">此外,apps 設計的過程也分成<b>設計(Design)</b>畫面<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixyoSZK-mwhRyRIodHtJnCfFG6y0vK9YNSNzXWDnhcF4QRBLG3Zx6XxULh4l8LdJ1EnxPhUjkGWGIFr9dn1oJ3DtiWHvvjP1HOtcfYxvBqyIwXZdIgtGjDObz9We-nurb1xJcccs3L_S6Ama4ARUuvMyFBqo-MMU82RzVNrJMkl6UDGaxW2YOKbQ/s59/a.jpg" style="margin-left: 1em; margin-right: 1em; text-align: center; text-indent: 24pt;"><img border="0" data-original-height="32" data-original-width="59" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixyoSZK-mwhRyRIodHtJnCfFG6y0vK9YNSNzXWDnhcF4QRBLG3Zx6XxULh4l8LdJ1EnxPhUjkGWGIFr9dn1oJ3DtiWHvvjP1HOtcfYxvBqyIwXZdIgtGjDObz9We-nurb1xJcccs3L_S6Ama4ARUuvMyFBqo-MMU82RzVNrJMkl6UDGaxW2YOKbQ/s1600/a.jpg" width="59" /></a><span style="text-indent: 24pt;">與<b>程式(Blocks)</b>畫面</span><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUvBpuhb9VhhpKE9J9jmIfbejjrMczKfttRT8Z7H8nY-fb3l7KAWOXSJZf9PmTTIIqo0JDaxQ6Uy0M48x8Jp6HhTUO5_0ZLXWqR3Wc6RbyCU8cvfp4mDq_ZTT_FpHy5ls5XR-yJpn2k-CRLi8EoD08NCT0lnhMrTPBPUyktPkfvP0crLGoETxXFA/s55/b.jpg" style="margin-left: 1em; margin-right: 1em; text-align: center; text-indent: 24pt;"><img border="0" data-original-height="34" data-original-width="55" height="34" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUvBpuhb9VhhpKE9J9jmIfbejjrMczKfttRT8Z7H8nY-fb3l7KAWOXSJZf9PmTTIIqo0JDaxQ6Uy0M48x8Jp6HhTUO5_0ZLXWqR3Wc6RbyCU8cvfp4mDq_ZTT_FpHy5ls5XR-yJpn2k-CRLi8EoD08NCT0lnhMrTPBPUyktPkfvP0crLGoETxXFA/s1600/b.jpg" width="55" /></a><span style="text-indent: 24pt;">。我們將在隨後的兩小節中詳細說明。</span></div><div style="background: white; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;"><br /></div></div><div style="text-align: center;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiA2noHQmONUxxvipRSjL55nev10TFujxDbtU5-0yQ0jD7kn7ASbTHofE5KumDB4-j1gm9qwyTFwlm1rWpXwHWU8YFraFjJbHTSSxngpNVC8FVB59jLbdXsivYuSFWsygT6Zg8ng_rl61NMeHO0vvsS_uspJsEGvS3dZv086WwUzjM_ATwQ2fBcrw/s1920/Snap2.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="1080" data-original-width="1920" height="360" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiA2noHQmONUxxvipRSjL55nev10TFujxDbtU5-0yQ0jD7kn7ASbTHofE5KumDB4-j1gm9qwyTFwlm1rWpXwHWU8YFraFjJbHTSSxngpNVC8FVB59jLbdXsivYuSFWsygT6Zg8ng_rl61NMeHO0vvsS_uspJsEGvS3dZv086WwUzjM_ATwQ2fBcrw/w640-h360/Snap2.jpg" width="640" /></a></span></div><div style="text-align: center;"><span face="標楷體" style="font-size: x-small; mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">圖 3:Thunkable IDE</span></div><h1><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">設計畫面</span></h1><div style="background: white; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;">app 設計第一要務是要先想好它的呈現畫面。如圖 4 所示,我們需要 3 個文字標籤、2 個輸入文字和 1 個按鈕。</div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: justify;"><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinH9guaJDVslM2ShSWs_1l7v9EuKVaTMPXIVj5Ge6gLh8U4OTZWYMm51j0QrqMkVaUAiIaFjA7vSJq3CuguHWZnoC9sXB1mFiou-Kbxr6aVA1CcjTewRVxF82rGhD51aHh__tSrtpmIUAz8os_XoNJlC_eIUINkVdkKiRaNa9jaQki6kFatoT9qQ/s673/0.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="673" data-original-width="381" height="640" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinH9guaJDVslM2ShSWs_1l7v9EuKVaTMPXIVj5Ge6gLh8U4OTZWYMm51j0QrqMkVaUAiIaFjA7vSJq3CuguHWZnoC9sXB1mFiou-Kbxr6aVA1CcjTewRVxF82rGhD51aHh__tSrtpmIUAz8os_XoNJlC_eIUINkVdkKiRaNa9jaQki6kFatoT9qQ/w362-h640/0.jpg" width="362" /></a></div><div class="separator" style="clear: both;"><span style="font-size: small;">圖 4:UI 設計圖</span></div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both; text-align: justify;">在圖 5 中詳列了圖 4 用到的元件,將之以「元件名稱縮寫+用途」重新命名,並各元件對應的屬性。其中,為了畫面管理方便,我們在第一個數字和第二個數字區域使用 Group 來將 Label 與 Text Input 兩個元件以群組方式打包起來。</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZFrMAEecyaoTY0KX2x56m6WI_1z6bvnNNwxuySlhkzGN54XtfVTDaeMiWr-yoJ1uqzPDMIEetW-P1gmLJvZfq-dWB6qaFoxzNHWycWbLe8WRO0u0NmVNMbsA9s60GxZ8yWW_y0kSQXMgCnsgPq9f2MCvZB5OnoiTHutNDgm1gG6uHchGvv2b2wg/s649/0.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="399" data-original-width="649" height="246" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZFrMAEecyaoTY0KX2x56m6WI_1z6bvnNNwxuySlhkzGN54XtfVTDaeMiWr-yoJ1uqzPDMIEetW-P1gmLJvZfq-dWB6qaFoxzNHWycWbLe8WRO0u0NmVNMbsA9s60GxZ8yWW_y0kSQXMgCnsgPq9f2MCvZB5OnoiTHutNDgm1gG6uHchGvv2b2wg/w400-h246/0.jpg" width="400" /></a> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEho08yAtJiddonnFZpEoyzFeLkfdZitVri2orCZfXlx--dHHTSoIh6IgwEznck0_EvwFhm0n86W5VYMAvvpaWqfhrg7yZVNcFQC5Ikma82hUoqgwMj2Il3nFkr-geKzB_n3YjDo3KqUskT7k5iYPfDQsnQSqQW-74wHxE7NxqpxFxGDDFW2lO9Ssw/s414/Snap5.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="414" data-original-width="319" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEho08yAtJiddonnFZpEoyzFeLkfdZitVri2orCZfXlx--dHHTSoIh6IgwEznck0_EvwFhm0n86W5VYMAvvpaWqfhrg7yZVNcFQC5Ikma82hUoqgwMj2Il3nFkr-geKzB_n3YjDo3KqUskT7k5iYPfDQsnQSqQW-74wHxE7NxqpxFxGDDFW2lO9Ssw/w309-h400/Snap5.jpg" width="309" /></a> </div><span style="font-size: small;">圖 5:元件配置、命名與其屬性設定</span></div></div></div></div></div></div></div><div class="separator" style="clear: both;"><span style="background-color: white; text-indent: 32px;"><br /></span></div></div><h1>程式畫面</h1><p class="MsoNormal" style="mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;">在圖 4 的 app 畫面中,我們輸入兩個數字 opd1 和 opd2,按下(Click 事件)藍色的計算鈕後將它們的相加的結果顯示在畫面的最下方。</p><div style="text-align: center;"><br /></div><div style="text-align: center;"><span face="標楷體" style="font-size: x-small; mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhO1BWo02thn4-RDET7K6-8zRofoalBKQYGSlGWIzQ173V8CYN2kerx3xvA0mSMz6madz-e8PxsMiFwNzoxzT5byQjqvjSiE9VfnI-uXtWZpqHmsehU-Hc9EslXpCUAEUcwpzd4fo1o9kqviORK2wlrHGGel2z1DYk0zdiH8K83PmAcwsCRKCmy_A/s909/Snap3.jpg" style="font-size: medium; margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="254" data-original-width="909" height="178" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhO1BWo02thn4-RDET7K6-8zRofoalBKQYGSlGWIzQ173V8CYN2kerx3xvA0mSMz6madz-e8PxsMiFwNzoxzT5byQjqvjSiE9VfnI-uXtWZpqHmsehU-Hc9EslXpCUAEUcwpzd4fo1o9kqviORK2wlrHGGel2z1DYk0zdiH8K83PmAcwsCRKCmy_A/w640-h178/Snap3.jpg" width="640" /></a></span></div><div style="text-align: center;"><span face="標楷體" style="font-size: x-small; mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">圖 6:積木程式</span></div><p><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><o:p></o:p></span></p><div style="mso-element: footnote-list;"><hr align="left" size="1" width="33%" /><!--[endif]--><div id="ftn1" style="mso-element: footnote;"><div style="text-align: justify;"><span style="font-size: x-small;">[1] <a href="http://creativecommons.tw/explore" style="color: #2288bb; font-family: times, "times new roman", serif; text-decoration-line: none;" target="_blank">六種授權條款</a><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;">。</span></span></div></div></div><p></p>Ted Leehttp://www.blogger.com/profile/03077454870590095355noreply@blogger.com0tag:blogger.com,1999:blog-1468347421357730785.post-81163241122853601532023-01-15T15:53:00.028+08:002023-01-15T21:07:30.473+08:00[AI, Python, 深蹲, squat] Python 蹲的門面<h1 style="text-align: center;"> <span style="font-size: x-large; text-align: center;"><b>Python 蹲的門面</b></span></h1><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><a href="https://www.facebook.com/groups/134149180510967/" style="color: #2288bb; text-decoration-line: none;" target="_blank"><span style="font-family: times, "times new roman", serif;">Ted Lee的土饅頭(To Mentor)工坊</span></a></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><div><span style="font-family: times, "times new roman", serif;">Line:ted2016.kpvs</span><br /><span style="font-family: times, "times new roman", serif;">Email:Lct4246@gmail.com</span><br /><span style="font-family: times, "times new roman", serif;"><span style="font-family: "times new roman", serif;">FB</span>:<span style="font-family: "times new roman", serif;">http://gg.gg/</span><span style="color: #00cc00; font-family: "times new roman", serif;">TedLee</span><span style="color: red; font-family: "times new roman", serif;">FB</span><span style="font-family: "times new roman", serif;">/</span></span></div><div><span lang="" style="font-family: times, "times new roman", serif; font-size: 12pt;">Blog<span style="font-family: "times new roman"; font-size: small;">:</span>http://gg.gg/<span style="color: #00cc00;">TedLee</span><span style="color: red;">Blog</span>/</span><br /></div></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><span style="font-family: times, "times new roman", serif;"><br /></span></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><span style="font-family: times, "times new roman", serif;">Jan. 15, 2023</span></div><div style="text-align: center;"><span><span style="color: #222222; font-family: times, "times new roman", serif;"><span style="font-size: 13.2px;"><div class="separator" style="clear: both;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s88/CC.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="31" data-original-width="88" height="31" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s1600/CC.png" width="88" /></a>[1]</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/Gm6o7m-QH6Y" width="320" youtube-src-id="Gm6o7m-QH6Y"></iframe></div><div class="separator" style="clear: both;"><br /></div></span></span></span></div><div style="background: white; text-align: justify; text-indent: 24pt;">在筆者的<span style="text-indent: 24pt;">先前拙著《用變數傾印法玩 Python 蹲》(</span><a href="https://lct4246.blogspot.com/2023/01/ai-python-squat-python.html" style="text-indent: 24pt;" target="_blank">https://reurl.cc/LXk1qx</a><span style="text-indent: 24pt;">)一文中,我們成功地在陳會安老師研發的 fChart 中的 </span><span style="color: red; text-indent: 24pt;">Thonny IDE</span><span style="text-indent: 24pt;"> 測試了深蹲偵測及計次範例。本文將進一步地甞試以 fChart 內建的 Tinker 套件 [2] 為之再加上一套</span><b style="text-indent: 24pt;">使用者介面(user interface,UI)</b><span style="text-indent: 24pt;">來梳妝打扮一番</span><span style="text-indent: 24pt;">。</span></div><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><o:p></o:p></span><p></p><div style="text-align: justify;"><br /></div><div style="text-align: center;"><span style="background-color: white;"><h1 style="text-align: left;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">新增功能</span></h1><div style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;"><span style="color: #333333; font-size: 16px; text-indent: 0px;">在本文中,我們將為</span><span>《用變數傾印法玩 Python 蹲》範例擴充下列兩個新功能:</span></div></span></div><div style="text-align: left;"><ol style="text-align: justify;"><li> 改用攝影機即時取得的影像(而非事先預錄的影片)。</li><li>增設深蹲達標關卡(為了便於測試,暫訂為深蹲三下)。</li></ol></div><div style="text-align: left;"> </div><h1><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">UI 佈局(layout)</span></h1><div style="background: white; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;">在圖 1 上方,我們設計了一個 3×2 大小的畫面,第一行顯示專案名稱(Python 蹲)與版次(V1.0)<span style="text-indent: 24pt;">,第二行顯示由攝影機取得的即時影像與相關訊息,第三行為留白及作者姓名(Ted Lee)。圖 1 下方為 Tinker 刻出來的畫面。</span></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: justify;"><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><br /></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnEsuSQ2Y0Ee1949WEyxoXipteu0OC26QS8P2eXP9P42AWOu76dTXIECpt0XScItqAWIo9kLOUAwN4ZMn1EwVGltb8S6TaWupMDQq6zvwpCvhJu_v091_2Dj4kwNVYWBj1XuEsZmwXkN5mUGat29pyjfOWjABs__swJ7uaJx2ZqmX2qc9_bunmGA/s371/Snap2.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="237" data-original-width="371" height="127" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnEsuSQ2Y0Ee1949WEyxoXipteu0OC26QS8P2eXP9P42AWOu76dTXIECpt0XScItqAWIo9kLOUAwN4ZMn1EwVGltb8S6TaWupMDQq6zvwpCvhJu_v091_2Dj4kwNVYWBj1XuEsZmwXkN5mUGat29pyjfOWjABs__swJ7uaJx2ZqmX2qc9_bunmGA/w200-h127/Snap2.jpg" width="200" /></a></div> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibePbCP4cwtD_0vmMSYcGzhNgDig71soWDxsx2YkiWeIUpXN9H9W4gXzVi1U6odIDc8j8ICk9dz2ZZrg0brhhk87xKww86Gqud1fwl9qhs9P-Rh-S1lwhYtJyr_1S0kylXNjP_R7rhcRNWWqniJP75prQKk5Y-O-Xl-hi32ztGu6WeiQElY6DiUQ/s1920/Snap2.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="1080" data-original-width="1920" height="360" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibePbCP4cwtD_0vmMSYcGzhNgDig71soWDxsx2YkiWeIUpXN9H9W4gXzVi1U6odIDc8j8ICk9dz2ZZrg0brhhk87xKww86Gqud1fwl9qhs9P-Rh-S1lwhYtJyr_1S0kylXNjP_R7rhcRNWWqniJP75prQKk5Y-O-Xl-hi32ztGu6WeiQElY6DiUQ/w640-h360/Snap2.jpg" width="640" /></a></div></div><div class="separator" style="clear: both; text-align: center;"><span style="font-size: x-small;">圖 1:UI 設計圖</span></div></div></div></div></div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both; text-align: justify;"><span style="background-color: white; text-indent: 32px;">在圖 2 中,我們先建立最外層的視窗 window <b>元件(component)</b>,再置入 frmTitle、frmVideo 和 frmTeam 三個框架元件(Frame)。緊</span><span style="background-color: white; text-indent: 32px;">接著,在 frmTitle 中擺放 lblTitle 和 lblVersion、在 frmVideo 中擺放 lblVideo 和 lblResult、在 frmTeam 中擺放 lblSpace 和 lblTeam。所有元件皆以 pack 佈局方式安排。詳如如圖 2 所示。</span></div><div class="separator" style="clear: both; text-align: justify;"><span style="background-color: white; text-indent: 32px;"><br /></span></div><div class="separator" style="clear: both; text-align: center;"><span style="background-color: white; text-indent: 32px;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOhSAzK3yKoZ36lo9OQIc60wpT-Npeo60gy9eE7jyy0hItENuqcnr4E_ZWDtCJTJr2FNQrOHSsdXmiVHNB7eaYLs5GVU1ol9bd73sIP8Xwsbq4YJEQBOmhyH1bzSihz7qQywGG1PRtJ5pSJ6Hs_eWRmr6BE1EME2z0Zrm81lpTeQo1sf5X29c-yQ/s577/Snap2.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="283" data-original-width="577" height="157" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOhSAzK3yKoZ36lo9OQIc60wpT-Npeo60gy9eE7jyy0hItENuqcnr4E_ZWDtCJTJr2FNQrOHSsdXmiVHNB7eaYLs5GVU1ol9bd73sIP8Xwsbq4YJEQBOmhyH1bzSihz7qQywGG1PRtJ5pSJ6Hs_eWRmr6BE1EME2z0Zrm81lpTeQo1sf5X29c-yQ/w320-h157/Snap2.jpg" width="320" /></a></div><div class="separator" style="clear: both; text-align: center;"><span style="background-color: transparent; font-size: x-small;">圖 2:UI 元件佈局</span></div></span><span style="background-color: white; text-indent: 32px;"><br /></span></div></div><h1>程式邏輯</h1><p class="MsoNormal" style="mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;">我們將程式執行的流程畫成圖 3 的流程圖。此外,程式採<b>模組化程式設計(modularized programming)</b>的方法,將獨立的功能以下列三個副程式來達成:</p><div style="text-align: center;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: justify;"><ol><li><span style="color: #ff00fe;">detectPose()</span>:偵測姿勢。</li><li><span style="color: #ffa400;">updateUI()</span>:即時更新影像標籤 lblVideo。</li><li><span style="color: #2b00fe;">cleanUp()</span>:程式結束,釋放<b>已配置資源(allocated resources)</b>。</li></ol></div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEja5c-3B4maLozW8e6stHO0uVPDvjKV-6jcA2oCjnOQj-db2j4p6zf2v8GweJufx9v8QdtXMC1eCLmg7NqeWDFHI09Vc1t5NLbE5Lg2Go0AuEyJs7d3SHJHJ3cSHLKLVrhw1IvvkCnBjaazyTj_5XHkVv7vaYrpqUTleM1unq9FwSJNmk8ZOaSoXg/s928/Snap1.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="555" data-original-width="928" height="382" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEja5c-3B4maLozW8e6stHO0uVPDvjKV-6jcA2oCjnOQj-db2j4p6zf2v8GweJufx9v8QdtXMC1eCLmg7NqeWDFHI09Vc1t5NLbE5Lg2Go0AuEyJs7d3SHJHJ3cSHLKLVrhw1IvvkCnBjaazyTj_5XHkVv7vaYrpqUTleM1unq9FwSJNmk8ZOaSoXg/w640-h382/Snap1.jpg" width="640" /></a></div><div class="separator" style="clear: both; text-align: center;"><span style="font-size: small;">圖 3:本文的流程圖</span></div></div></div></span></div><div><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";"><br /></span></div><div><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";"><span style="text-align: justify;">本文的執行結果請參考 </span></span><a href="https://youtu.be/Gm6o7m-QH6Y">https://youtu.be/Gm6o7m-QH6Y</a>。<span style="text-align: justify;">完整程式碼詳列如下(讀者亦可由 </span><a href="https://drive.google.com/file/d/1JCep80Hj7LrFVrY5BpHnH3Y_6coWt5WZ/view?usp=share_link" style="text-align: justify;" target="_blank">https://reurl.cc/rZ7aob</a><span style="text-align: justify;"> 下載)。</span></div><div><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";"><span style="text-align: justify;"><br /></span></span></div><div><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";"><span style="text-align: justify;"><div>import cv2</div><div>import numpy as np</div><div>from PIL import ImageFont, ImageDraw, Image</div><div> </div><div>from tkinter import *</div><div>from PIL import Image, ImageTk</div><div><br /></div><div>from PoseModule import PoseDetector</div><div>dir = 0 </div><div>count = 0</div><div><br /></div><div><span style="color: #ffa400;">def updateUI():</span></div><div><span style="color: #ffa400;"> global img, lblVideo</span></div><div><span style="color: #ffa400;"> </span></div><div><span style="color: #ffa400;"> cv2image = cv2.cvtColor(img, cv2.COLOR_BGR2RGBA)</span></div><div><span style="color: #ffa400;"> img = Image.fromarray(cv2image)</span></div><div><span style="color: #ffa400;"> imgtk = ImageTk.PhotoImage(image = img) </span></div><div><span style="color: #ffa400;"><br /></span></div><div><span style="color: #ffa400;"> lblVideo.imgtk = imgtk</span></div><div><span style="color: #ffa400;"> lblVideo.config(image = imgtk)</span></div><div><span style="color: #ffa400;"> lblVideo.after(100, detectPose)</span></div><div><span style="color: #ffa400;"> </span></div><div><span style="color: #ffa400;"> if count > 3:</span></div><div><span style="color: #ffa400;"> lblResult.config(text = '你已達標!') </span></div><div> </div><div><span style="color: #ff00fe;">def detectPose():</span></div><div><span style="color: #ff00fe;"> global cap, detector, dir, count, img</span></div><div><span style="color: #ff00fe;"><br /></span></div><div><span style="color: #ff00fe;"> success, img = cap.read()</span></div><div><span style="color: #ff00fe;"> if success:</span></div><div><span style="color: #ff00fe;"> img = cv2.resize(img, (640, 480))</span></div><div><span style="color: #ff00fe;"> h, w, c = img.shape</span></div><div><span style="color: #ff00fe;"> pose, img = detector.findPose(img, draw=True)</span></div><div><span style="color: #ff00fe;"> </span></div><div><span style="color: #ff00fe;"> if pose:</span></div><div><span style="color: #ff00fe;"> lmList = pose["lmList"]</span></div><div><span style="color: #ff00fe;"> angle, img = detector.findAngle(lmList[24], lmList[26], lmList[28], img)</span></div><div><span style="color: #ff00fe;"> bar = np.interp(angle, (85, 180), (w//2-100, w//2+100))</span></div><div><span style="color: #ff00fe;"> cv2.rectangle(img, (w//2-100, 50), (int(bar), 100), (0, 255, 0), cv2.FILLED)</span></div><div><span style="color: #ff00fe;"><br /></span></div><div><span style="color: #ff00fe;"> if angle <= 150: </span></div><div><span style="color: #ff00fe;"> if dir == 0:</span></div><div><span style="color: #ff00fe;"> count = count + 0.5</span></div><div><span style="color: #ff00fe;"> dir = 1</span></div><div><span style="color: #ff00fe;"> </span></div><div><span style="color: #ff00fe;"> if angle >= 170: </span></div><div><span style="color: #ff00fe;"> if dir == 1:</span></div><div><span style="color: #ff00fe;"> count = count + 0.5</span></div><div><span style="color: #ff00fe;"> dir = 0</span></div><div><span style="color: #ff00fe;"> </span></div><div><span style="color: #ff00fe;"> msg = str(int(count)) </span></div><div><span style="color: #ff00fe;"> cv2.putText(img, msg, (100, 150), cv2.FONT_HERSHEY_SIMPLEX, 5, (255, 255, 255), 20)</span></div><div><span style="color: #ff00fe;"> </span></div><div><span style="color: #ff00fe;"> cv2.imshow("Pose", img)</span></div><div><span style="color: #ff00fe;"> updateUI()</span></div><div><br /></div><div><span style="color: #2b00fe;">def cleanUp():</span></div><div><span style="color: #2b00fe;"> window.destroy()</span></div><div><span style="color: #2b00fe;"> cap.release()</span></div><div><span style="color: #2b00fe;"> cv2.destroyAllWindows()</span></div><div><br /></div><div>cap = cv2.VideoCapture(0) #####開啟攝影機</div><div>detector = PoseDetector()</div><div><br /></div><div>#開 UI --------------------------------------------------------------------------------------------------------- </div><div>#widow</div><div>window = Tk()</div><div>window.title('Python 蹲')</div><div>#window.geometry('1024x768')</div><div>window.attributes('-fullscreen', True)</div><div><br /></div><div><br /></div><div>#frame</div><div>frmTitle = Frame(window)</div><div>frmTitle.pack(side = TOP, fill = BOTH, expand = YES)</div><div><br /></div><div>frmVideo = Frame(window)</div><div>frmVideo.pack(side = TOP, fill = BOTH, expand = YES) </div><div><br /></div><div>frmTeam = Frame(window)</div><div>frmTeam.pack(side = BOTTOM, fill = BOTH, expand = YES)</div><div><br /></div><div><br /></div><div>#Title</div><div>lblTitle = Label(frmTitle, text = "Python 蹲", fg = '#005E5E', bg = '#666666', font = ('標楷體', 70), borderwidth = 0, highlightthickness = 0, relief = "sunken") </div><div>lblTitle.pack(side = LEFT, fill = BOTH, expand = YES)</div><div><br /></div><div>lblVersion = Label(frmTitle, text = "V1.0", fg = '#005E5E', bg = '#666666', font = ('標楷體', 20), borderwidth = 0, highlightthickness = 0, relief = "sunken") </div><div>lblVersion.pack(side = RIGHT, fill = BOTH, expand = YES)</div><div><br /></div><div><br /></div><div>#Video</div><div>lblVideo = Label(frmVideo, bg = '#005E5E', borderwidth = 0, highlightthickness = 0, relief = "ridge")</div><div>lblVideo.pack(side = LEFT, fill = BOTH, expand = YES)</div><div><br /></div><div>lblResult = Label(frmVideo, text = "", fg = 'white', bg = '#005E5E', font = ('標楷體', 40), borderwidth = 0, highlightthickness = 0, relief = "sunken")</div><div>lblResult.pack(side = RIGHT, fill = BOTH, expand = YES)</div><div><br /></div><div><br /></div><div>#Team</div><div>lblSpace = Label(frmTeam, text = "", fg = '#005E5E', bg = '#666666', font = ('標楷體', 20), borderwidth = 0, highlightthickness = 0, relief = "sunken") </div><div>lblSpace.pack(side = LEFT, fill = BOTH, expand = YES)</div><div><br /></div><div>lblTeam = Label(frmTeam, text = "Ted Lee", fg = '#005E5E', bg = '#666666', font = ('標楷體', 20), borderwidth = 0, highlightthickness = 0, relief = "sunken") </div><div>lblTeam.pack(side = RIGHT, fill = BOTH, expand = YES)</div><div><br /></div><div>#姿勢識別 ---------------------------------------------------------------------------------------------------</div><div>detectPose()</div><div> </div><div>window.bind('<Escape>', lambda e: cleanUp())</div><div>mainloop()</div><div><br /></div></span></span></div><div><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";"><span style="text-align: justify;"><br /></span></span></div><h1><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">進階問題</span></h1><p class="MsoListParagraph" style="background: white; margin-left: 24pt; mso-list: l0 level1 lfo1; mso-para-margin-left: 0gd; text-align: justify; text-indent: -24pt; text-justify: inter-ideograph;"><!--[if !supportLists]--></p><div style="mso-element: footnote-list;"><ol><li>建置一「分數雲端排行榜」來記錄玩家的深蹲分數。</li><li>修改程式,使得深蹲次數達標後出現是否「重新訓練」詢問。</li></ol></div><div style="mso-element: footnote-list;"><hr align="left" size="1" width="33%" /><!--[endif]--><div id="ftn1" style="mso-element: footnote;"><div style="text-align: justify;"><span style="font-size: x-small;">[1] <a href="http://creativecommons.tw/explore" style="color: #2288bb; font-family: times, "times new roman", serif; text-decoration-line: none;" target="_blank">六種授權條款</a><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;">。</span></span></div><div style="text-align: justify;"><span style="font-size: x-small;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;">[2] 請參考拙著《AI 成績查詢系統》(<a href="https://vmaker.tw/archives/57591" target="_blank">https://reurl.cc/aaWlKl</a>)一文</span></span><span style="font-size: x-small;"><span style="color: #222222;">。</span></span></div></div></div>Ted Leehttp://www.blogger.com/profile/03077454870590095355noreply@blogger.com0tag:blogger.com,1999:blog-1468347421357730785.post-64558051895133174562023-01-14T15:34:00.065+08:002023-01-19T15:55:51.356+08:00[AI, Python, 深蹲, squat] 用變數傾印法玩 Python 蹲<h1 style="text-align: center;"><span style="font-size: large;">用變數傾印法玩 Python 蹲</span></h1><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><a href="https://www.facebook.com/groups/134149180510967/" style="color: #2288bb; text-decoration-line: none;" target="_blank"><span style="font-family: times, "times new roman", serif;">Ted Lee的土饅頭(To Mentor)工坊</span></a></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><div><span style="font-family: times, "times new roman", serif;">Line:ted2016.kpvs</span><br /><span style="font-family: times, "times new roman", serif;">Email:Lct4246@gmail.com</span><br /><span style="font-family: times, "times new roman", serif;"><span style="font-family: "times new roman", serif;">FB</span>:<span style="font-family: "times new roman", serif;">http://gg.gg/</span><span style="color: #00cc00; font-family: "times new roman", serif;">TedLee</span><span style="color: red; font-family: "times new roman", serif;">FB</span><span style="font-family: "times new roman", serif;">/</span></span></div><div><span lang="" style="font-family: times, "times new roman", serif; font-size: 12pt;">Blog<span style="font-family: "times new roman"; font-size: small;">:</span>http://gg.gg/<span style="color: #00cc00;">TedLee</span><span style="color: red;">Blog</span>/</span><br /></div></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><span style="font-family: times, "times new roman", serif;"><br /></span></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><span style="font-family: times, "times new roman", serif;">Jan. 14, 2023</span></div><div style="text-align: center;"><span><span style="color: #222222; font-family: times, "times new roman", serif;"><span style="font-size: 13.2px;"><div class="separator" style="clear: both;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s88/CC.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="31" data-original-width="88" height="31" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s1600/CC.png" width="88" /></a>[1]</div></span></span></span></div><p class="MsoNormal" style="background: white; mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;"><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">本文將一門深入陳會安老師在 <a href="https://www.facebook.com/groups/632104054075149/posts/1029134331038784/?__cft__[0]=AZW5RFuPd76Q-YtW3oE_ELYhovmz3OUZn25fKiDFa1WDN7CIoZ62HGXj2Dlnii6BCf1VVBa8x_BdPs5yueS7ybxYw_R6yOrTBigShswgN_87LH9QN0ZALH7gr6quD16sI1VhVUTLY0xqCMOq-hS2MvbIc9BWxVxqxuHtYy4-zrQ-XDc33IZ6mnU7X-MQ0GZAd2E&__tn__=%2CO%2CP-R">https://reurl.cc/mZ1mD1</a> 分享的《看圖學Python人工智慧程式設計》(<a href="http://www.chwa.com.tw/newciv/bookinfo.asp?b_no=06498007">https://reurl.cc/rZW79r</a>)一書中的範例。此範例使用了 </span><span face="標楷體" style="color: red; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">Google MediaPipe</span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">(<a href="https://google.github.io/mediapipe/">https://reurl.cc/nZg8mX</a>)跨平台機器學習解決方案,讓我們得以使用短短的 </span><span face="標楷體" style="color: red; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">4x 行</span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";"> Python 程式碼就能實現深<b>蹲(squat)</b>姿勢的判別並能計次。</span></p><p class="MsoNormal" style="background: white; mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;"><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">會安老師說:「</span><span face="標楷體" style="color: red; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">只要懂得程式語言三大結構(循序、選擇與重複),再了解一點 Python 程式語言的語法,就能開始玩 AI了!</span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">」</span><span style="text-indent: 24pt;">讀者們,Python 蹲、Python 蹲,Python 蹲完換你們蹲了喔!</span></p><p class="MsoNormal" style="background: white; mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;"><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";"><br /></span></p><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><o:p></o:p></span><p></p><h1><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">開發環境建置</span></h1><div style="text-align: justify;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";"><span face=""Noto Sans Tamil UI", sans-serif" style="background-color: white; color: #333333; font-size: 16px;">本文使用會安老師開發的 fChart 流程圖轉語法中的 </span><span face=""Noto Sans Tamil UI", sans-serif" style="background-color: white; font-size: 16px;"><span style="color: red;">Thonny IDE</span></span><span face=""Noto Sans Tamil UI", sans-serif" style="background-color: white; color: #333333; font-size: 16px;"> [2],它</span></span><span face=""Noto Sans Tamil UI", sans-serif" style="background-color: white; color: #333333; font-size: 16px;">已裝妥了 CVZone 與 Tinker 套件。</span></div><div style="text-align: justify;"><span face=""Noto Sans Tamil UI", sans-serif" style="background-color: white; color: #333333; font-size: 16px;"><br /></span></div><div style="text-align: justify;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";"><span face=""Noto Sans Tamil UI", sans-serif" style="background-color: white; font-size: 16px;"><span style="color: #2b00fe;">下載</span></span><span face=""Noto Sans Tamil UI", sans-serif" style="background-color: white; color: #333333; font-size: 16px;"> </span></span><span face=""Noto Sans Tamil UI", sans-serif" style="background-color: white; color: #333333; font-size: 16px;">英文版「</span><span style="text-align: left;"><span face="Noto Sans Tamil UI, sans-serif" style="color: #333333;">fChartThonny6_cvzone_en.zip</span></span><span face=""Noto Sans Tamil UI", sans-serif" style="background-color: white; color: #333333; font-size: 16px;">」</span>可由 <a href="https://drive.google.com/file/d/18GlnhiEwbjuJN4cp27HFRRlVGxOkI6cD/view?usp=share_link" target="_blank">https://reurl.cc/gQ59Vb</a> 下載<span face=""Noto Sans Tamil UI", sans-serif" style="background-color: white; color: #333333; font-size: 16px;">。此外,深蹲範例程式的原始碼「</span><span style="text-align: left;"><span face="Noto Sans Tamil UI, sans-serif" style="color: #333333;">Squat.zip」</span></span><span face=""Noto Sans Tamil UI", sans-serif" style="background-color: white; color: #333333; font-size: 16px;">可由 </span><a href="https://drive.google.com/file/d/1BLda2MtfccZZPqDiyuYdLl29IOxEomC6/view?usp=share_link" style="font-family: "Noto Sans Tamil UI", sans-serif; font-size: 16px;" target="_blank">https://reurl.cc/x1qzE5</a><span face=""Noto Sans Tamil UI", sans-serif" style="background-color: white; color: #333333; font-size: 16px;"> 下載。</span></div><div style="text-align: justify;"><span face=""Noto Sans Tamil UI", sans-serif" style="background-color: white; font-size: 16px;"><span style="color: #2b00fe;">解壓縮</span><span style="color: #333333;"> 將上述的兩支 .zip 檔解壓縮至磁機的</span><b><span style="color: #333333;">「</span><span style="color: red;">根</span><span style="color: #333333;">」目錄(root directory)</span></b><span style="color: #333333;">下(例如:c:\),如圖 1 所示。</span></span></div><div style="text-align: justify;"><span face=""Noto Sans Tamil UI", sans-serif" style="background-color: white; color: #333333; font-size: 16px;"><br /></span></div><div style="text-align: center;"><span style="background-color: white;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEh7R7q_SyFkCWhD6veMh939L8vSe8vQUUODoBF5IOFLH5rD-qWQzd6TNpzzomPBF9lkx9dZ6vDtdJuBCVTGkL4ht1VxQUNW78rwlYpO6BcQQ0bY5KlCi17ZAu2BJTYZEKY-I4mBaxyAaQVoj68xXX8fD9ZPI9p6t_sheXNx8y6qU4hR-W4Z6XEUQQ" style="color: #333333; font-family: "Noto Sans Tamil UI", sans-serif; font-size: 16px; margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="592" data-original-width="1198" height="316" src="https://blogger.googleusercontent.com/img/a/AVvXsEh7R7q_SyFkCWhD6veMh939L8vSe8vQUUODoBF5IOFLH5rD-qWQzd6TNpzzomPBF9lkx9dZ6vDtdJuBCVTGkL4ht1VxQUNW78rwlYpO6BcQQ0bY5KlCi17ZAu2BJTYZEKY-I4mBaxyAaQVoj68xXX8fD9ZPI9p6t_sheXNx8y6qU4hR-W4Z6XEUQQ=w640-h316" width="640" /></a><span face="Noto Sans Tamil UI, sans-serif" style="color: #333333;"> </span><div class="separator" style="clear: both; color: #333333; font-family: "Noto Sans Tamil UI", sans-serif; font-size: 16px; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEgzxP-faZg49hz4mB5YXir1YnrCIlkq0HaZMgKF9OlJr2chKHa3vd8znBEVPjrN6HkBGOIs6Hjpcu71Al_vjKtmJKQtNLfu4i0imQKMSIE4tt2hAJB2SqbSd6UQMWbNrDZmWBAMz0POEZ6CPUsf2K9CaV3hIh1frcEhGpIhPB_d5P576VOS8LqWVA" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="443" data-original-width="933" height="304" src="https://blogger.googleusercontent.com/img/a/AVvXsEgzxP-faZg49hz4mB5YXir1YnrCIlkq0HaZMgKF9OlJr2chKHa3vd8znBEVPjrN6HkBGOIs6Hjpcu71Al_vjKtmJKQtNLfu4i0imQKMSIE4tt2hAJB2SqbSd6UQMWbNrDZmWBAMz0POEZ6CPUsf2K9CaV3hIh1frcEhGpIhPB_d5P576VOS8LqWVA=w640-h304" width="640" /></a></div><br /><span style="font-size: x-small;">圖 1:</span><span face="Noto Sans Tamil UI, sans-serif" style="color: #333333; font-size: x-small;">將「fChartThonny6_cvzone_en.zip」和「Squat.zip」解壓縮至 c:\</span></div></div><br /><div style="text-align: justify;"><span style="color: #2b00fe;">Thonny</span> 雙撃「C:\fChartThonny6_cvzone_en\WinPython」路徑下的「thonny.vbs」以開啟 Thonny(圖 2)。</div><div style="text-align: justify;"><br /></div></span><span style="background-color: white;"><div style="text-align: center;"><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjVZHmmloWvV3eqYZMgk2eQt6KEXlWqBT5rDMhkdHYW40YVRkaTlvg_khRjSn_QSUe8UKayaJ-7R_AupFUGVgBUXIkk57Zk5tlXEAzv65TsdevVAmbUlvJmtJ3QhfwZrwkoUFmLCOKy4E1uqL1XfgwvQR04EAtsXIrDhNaAespUZVRrgVSM79OSrw" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="742" data-original-width="1128" height="420" src="https://blogger.googleusercontent.com/img/a/AVvXsEjVZHmmloWvV3eqYZMgk2eQt6KEXlWqBT5rDMhkdHYW40YVRkaTlvg_khRjSn_QSUe8UKayaJ-7R_AupFUGVgBUXIkk57Zk5tlXEAzv65TsdevVAmbUlvJmtJ3QhfwZrwkoUFmLCOKy4E1uqL1XfgwvQR04EAtsXIrDhNaAespUZVRrgVSM79OSrw=w640-h420" width="640" /></a></div><div class="separator" style="clear: both; text-align: center;"><span style="color: black; font-size: small;">圖 2:開啟 Thonny IDE</span></div><div class="separator" style="clear: both; text-align: center;"><br /></div><div class="separator" style="clear: both; text-align: justify;"><span style="color: #2b00fe;">Squat.py</span> 在視窗左手邊的 Files 檔案管理中切換到「C:\Squat」後再雙撃「Squat.py」(圖 3)以載入<b>原始碼(source code)</b>。</div><div class="separator" style="clear: both; text-align: center;"><br /></div><img alt="" data-original-height="964" data-original-width="1920" height="322" src="https://blogger.googleusercontent.com/img/a/AVvXsEjc9RkHgjavkjw6qLdjsrt0xLDx0ibGLBuulkaFskarWrkeBiaMYWGEiBdjuIONS6az0Kp7souAgjcoUSNNZXI1NHWEr3-COuDPk7UhGBNOzlNNY1vllrpgcDXB88wShkDq0rjlOKzWKMyoMfk43aXWVA-TF2U3GkJJyU3bV3RCCuEZhPl2fKV9HA=w640-h322" width="640" /></div><span style="font-size: x-small;">圖 3:在 Thonny 中開啟 Squat.py</span><br /><br /></div></span></div><h1>程式碼追蹤</h1><div style="background: white; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;"><span style="text-indent: 24pt;">Squat.py 援用了「PoseModule.py」中的「PoseDetector」<b>類別(class)</b>,並載入「squat3_clip.mp4」預錄的影像檔做為測試資料。</span><span style="font-family: "Times New Roman", serif; text-indent: 24pt;"> 在 4x 行的程式碼中,最<b>核心(core)</b>的指令為<span style="color: red;">第 17 行定義於的 </span></span><span style="color: red;">PoseDetector 類別的</span><span style="font-family: "Times New Roman", serif; text-indent: 24pt;"><span style="color: red;"> findAngle() <b>方法(method)</b></span>!讀者們可先學習呼叫它的方法和需傳入的<b>參數列(parameter list)</b>。有需要再鑽進該類別去深究它是如何從影像資料中計算出深蹲的夾角的。</span></div><div style="background: white; margin-bottom: 13.5pt; text-align: justify; text-indent: 24pt;"><span style="font-family: "Times New Roman", serif; text-indent: 24pt;">本小節將使用「<span style="color: red;">變數<b>傾印(dump)</b></span>」暴力法(紮實的蹲馬步)將範例程式中插入「print(變數名)」,將用到變數一一印出來觀察其內容,藉以了解程式的設計邏輯。我們以</span></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: justify;"><span style="background-color: white; font-family: "Times New Roman", serif; text-indent: 24pt;"><blockquote><span style="color: #2b00fe;">L行號 變數名稱</span></blockquote></span></div><div class="separator" style="clear: both; text-align: justify;"><span style="background-color: white; font-family: "Times New Roman", serif; text-indent: 24pt;">方式來標示查看程式碼的第幾行變數值。</span></div><div class="separator" style="clear: both;"></div><div class="separator" style="clear: both; text-align: justify;"><span style="color: #2b00fe;"><br /></span></div><div class="separator" style="clear: both; text-align: justify;"><span style="color: #2b00fe;">L10 img</span> 在第 10 和第 11 行中插入 print(img) 指令,我們可以看到變數 img 的第一筆內容如下:</div><div class="separator" style="clear: both; text-align: justify;"><br /></div><div class="separator" style="clear: both; text-align: justify;"><div class="separator" style="clear: both;">[[[ 0 44 37]</div><div class="separator" style="clear: both;"> [ 2 50 43]</div><div class="separator" style="clear: both;"> [ 7 63 54]</div><div class="separator" style="clear: both;"> ...</div><div class="separator" style="clear: both;"> [ 20 48 78]</div><div class="separator" style="clear: both;"> [ 19 47 77]</div><div class="separator" style="clear: both;"> [ 18 46 76]]</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"> [[ 0 44 37]</div><div class="separator" style="clear: both;"> [ 2 50 43]</div><div class="separator" style="clear: both;"> [ 7 63 54]</div><div class="separator" style="clear: both;"> ...</div><div class="separator" style="clear: both;"> [ 18 46 76]</div><div class="separator" style="clear: both;"> [ 17 45 75]</div><div class="separator" style="clear: both;"> [ 16 44 74]]</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"> [[ 0 45 37]</div><div class="separator" style="clear: both;"> [ 0 51 43]</div><div class="separator" style="clear: both;"> [ 4 62 53]</div><div class="separator" style="clear: both;"> ...</div><div class="separator" style="clear: both;"> [ 15 43 73]</div><div class="separator" style="clear: both;"> [ 12 40 70]</div><div class="separator" style="clear: both;"> [ 11 39 69]]</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"> ...</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"> [[121 115 110]</div><div class="separator" style="clear: both;"> [123 117 112]</div><div class="separator" style="clear: both;"> [127 121 116]</div><div class="separator" style="clear: both;"> ...</div><div class="separator" style="clear: both;"> [ 19 40 71]</div><div class="separator" style="clear: both;"> [ 22 43 74]</div><div class="separator" style="clear: both;"> [ 23 44 75]]</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"> [[144 138 133]</div><div class="separator" style="clear: both;"> [146 140 135]</div><div class="separator" style="clear: both;"> [152 146 141]</div><div class="separator" style="clear: both;"> ...</div><div class="separator" style="clear: both;"> [ 23 44 75]</div><div class="separator" style="clear: both;"> [ 23 44 75]</div><div class="separator" style="clear: both;"> [ 23 44 75]]</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"> [[153 147 142]</div><div class="separator" style="clear: both;"> [152 146 141]</div><div class="separator" style="clear: both;"> [152 146 141]</div><div class="separator" style="clear: both;"> ...</div><div class="separator" style="clear: both;"> [ 23 44 75]</div><div class="separator" style="clear: both;"> [ 21 42 73]</div><div class="separator" style="clear: both;"> [ 19 40 71]]]</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjMA7RsK3qby7RkG6Fpe5AOD81ZacDAEPT-UbU7ExwFbsImra5RUigSCqSV0dUbQiHjjZqaux05fCtjSjGFA-NXWloHW8KLqmItNhnLNXJZT7GLFAXPk7jLT0WASxL3d48DYOAzUkXdGooxTk90bvkEwVrsWx4nI0qMRm03dtqpJowVxjyNU4FetQ" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="938" data-original-width="817" height="640" src="https://blogger.googleusercontent.com/img/a/AVvXsEjMA7RsK3qby7RkG6Fpe5AOD81ZacDAEPT-UbU7ExwFbsImra5RUigSCqSV0dUbQiHjjZqaux05fCtjSjGFA-NXWloHW8KLqmItNhnLNXJZT7GLFAXPk7jLT0WASxL3d48DYOAzUkXdGooxTk90bvkEwVrsWx4nI0qMRm03dtqpJowVxjyNU4FetQ=w557-h640" width="557" /></a></div><span style="font-size: x-small;">圖 4:</span><span style="background-color: white; font-family: "Times New Roman", serif; text-align: justify; text-indent: 32px;">變數傾印法</span></div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"><span style="color: #2b00fe;">L12 img</span> </div><div class="separator" style="clear: both;">[[[ 1 47 40]</div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"> [ 10 66 57]</div><div class="separator" style="clear: both;"> [ 12 70 61]</div><div class="separator" style="clear: both;"> ...</div><div class="separator" style="clear: both;"> [ 16 44 74]</div><div class="separator" style="clear: both;"> [ 20 48 78]</div><div class="separator" style="clear: both;"> [ 18 46 76]]</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"> [[ 0 48 40]</div><div class="separator" style="clear: both;"> [ 8 66 57]</div><div class="separator" style="clear: both;"> [ 1 56 47]</div><div class="separator" style="clear: both;"> ...</div><div class="separator" style="clear: both;"> [ 16 44 74]</div><div class="separator" style="clear: both;"> [ 16 44 74]</div><div class="separator" style="clear: both;"> [ 13 41 71]]</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"> [[ 1 50 42]</div><div class="separator" style="clear: both;"> [ 8 66 57]</div><div class="separator" style="clear: both;"> [ 5 61 52]</div><div class="separator" style="clear: both;"> ...</div><div class="separator" style="clear: both;"> [ 15 43 73]</div><div class="separator" style="clear: both;"> [ 13 41 71]</div><div class="separator" style="clear: both;"> [ 9 37 67]]</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"> ...</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"> [[151 145 140]</div><div class="separator" style="clear: both;"> [143 137 132]</div><div class="separator" style="clear: both;"> [133 127 122]</div><div class="separator" style="clear: both;"> ...</div><div class="separator" style="clear: both;"> [ 15 36 67]</div><div class="separator" style="clear: both;"> [ 12 33 64]</div><div class="separator" style="clear: both;"> [ 15 36 67]]</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"> [[128 122 117]</div><div class="separator" style="clear: both;"> [135 129 124]</div><div class="separator" style="clear: both;"> [145 139 134]</div><div class="separator" style="clear: both;"> ...</div><div class="separator" style="clear: both;"> [ 17 38 69]</div><div class="separator" style="clear: both;"> [ 19 40 71]</div><div class="separator" style="clear: both;"> [ 23 44 75]]</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"> [[151 145 140]</div><div class="separator" style="clear: both;"> [153 147 142]</div><div class="separator" style="clear: both;"> [156 150 145]</div><div class="separator" style="clear: both;"> ...</div><div class="separator" style="clear: both;"> [ 22 43 74]</div><div class="separator" style="clear: both;"> [ 23 44 75]</div><div class="separator" style="clear: both;"> [ 21 42 73]]]</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"><span style="color: #2b00fe;">L13 h, w, c</span> 「480 640 3」 color channel, 彩色圖片是3</div><div class="separator" style="clear: both;"><br /></div></div><div class="separator" style="clear: both;"><span style="color: #2b00fe;">L14 detector.findPose(img, draw=True)</span> </div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;">({'lmList': [[331, 126], [334, 121], [336, 121], [338, 121], [328, 121], [326, 121], [324, 121], [339, 124], [321, 124], [335, 133], [328, 132], [355, 164], [306, 163], [357, 213], [302, 210], [371, 198], [289, 200], [376, 194], [283, 193], [375, 190], [281, 190], [372, 191], [284, 192], [344, 253], [315, 254], [358, 328], [301, 332], [368, 399], [291, 400], [365, 407], [294, 410], [374, 422], [283, 423]], 'bbox': (282, 97, 97, 337), 'center': (330, 265)}, array([[[ 1, 47, 40],</div><div class="separator" style="clear: both;">[ 10, 66, 57],</div><div class="separator" style="clear: both;">[ 12, 70, 61],</div><div class="separator" style="clear: both;">...,</div><div class="separator" style="clear: both;">[ 16, 44, 74],</div><div class="separator" style="clear: both;">[ 20, 48, 78],</div><div class="separator" style="clear: both;">[ 18, 46, 76]],</div><div class="separator" style="clear: both;">[[ 0, 48, 40],</div><div class="separator" style="clear: both;">[ 8, 66, 57],</div><div class="separator" style="clear: both;">[ 1, 56, 47],</div><div class="separator" style="clear: both;">...,</div><div class="separator" style="clear: both;">[ 16, 44, 74],</div><div class="separator" style="clear: both;">[ 16, 44, 74],</div><div class="separator" style="clear: both;">[ 13, 41, 71]],</div><div class="separator" style="clear: both;">[[ 1, 50, 42],</div><div class="separator" style="clear: both;">[ 8, 66, 57],</div><div class="separator" style="clear: both;">[ 5, 61, 52],</div><div class="separator" style="clear: both;">...,</div><div class="separator" style="clear: both;">[ 15, 43, 73],</div><div class="separator" style="clear: both;">[ 13, 41, 71],</div><div class="separator" style="clear: both;">[ 9, 37, 67]],</div><div class="separator" style="clear: both;">...,</div><div class="separator" style="clear: both;">[[151, 145, 140],</div><div class="separator" style="clear: both;">[143, 137, 132],</div><div class="separator" style="clear: both;">[133, 127, 122],</div><div class="separator" style="clear: both;">...,</div><div class="separator" style="clear: both;">[ 15, 36, 67],</div><div class="separator" style="clear: both;">[ 12, 33, 64],</div><div class="separator" style="clear: both;">[ 15, 36, 67]],</div><div class="separator" style="clear: both;">[[128, 122, 117],</div><div class="separator" style="clear: both;">[135, 129, 124],</div><div class="separator" style="clear: both;">[145, 139, 134],</div><div class="separator" style="clear: both;">...,</div><div class="separator" style="clear: both;">[ 17, 38, 69],</div><div class="separator" style="clear: both;">[ 19, 40, 71],</div><div class="separator" style="clear: both;">[ 23, 44, 75]],</div><div class="separator" style="clear: both;">[[151, 145, 140],</div><div class="separator" style="clear: both;">[153, 147, 142],</div><div class="separator" style="clear: both;">[156, 150, 145],</div><div class="separator" style="clear: both;">...,</div><div class="separator" style="clear: both;">[ 22, 43, 74],</div><div class="separator" style="clear: both;">[ 23, 44, 75],</div><div class="separator" style="clear: both;">[ 21, 42, 73]]], dtype=uint8))</div></div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"><span style="color: #2b00fe;">L14 pose</span> </div><div class="separator" style="clear: both;">{'lmList': [[331, 126], [334, 121], [336, 121], [338, 121], [328, 121], [326, 121], [324, 121], [339, 124], [322, 124], [335, 133], [328, 132], [355, 163], [306, 163], [357, 215], [299, 214], [371, 199], [289, 199], [376, 194], [283, 191], [376, 191], [281, 188], [374, 192], [283, 189], [344, 254], [316, 255], [358, 328], [301, 332], [368, 400], [291, 400], [365, 409], [294, 410], [374, 422], [283, 423]], 'bbox': (282, 97, 97, 337), 'center': (330, 265)}</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"><span style="color: #2b00fe;">L14 img</span> </div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;">[[[ 1 47 40]</div><div class="separator" style="clear: both;">[ 10 66 57]</div><div class="separator" style="clear: both;">[ 12 70 61]</div><div class="separator" style="clear: both;">...</div><div class="separator" style="clear: both;">[ 16 44 74]</div><div class="separator" style="clear: both;">[ 20 48 78]</div><div class="separator" style="clear: both;">[ 18 46 76]]</div><div class="separator" style="clear: both;">[[ 0 48 40]</div><div class="separator" style="clear: both;">[ 8 66 57]</div><div class="separator" style="clear: both;">[ 1 56 47]</div><div class="separator" style="clear: both;">...</div><div class="separator" style="clear: both;">[ 16 44 74]</div><div class="separator" style="clear: both;">[ 16 44 74]</div><div class="separator" style="clear: both;">[ 13 41 71]]</div><div class="separator" style="clear: both;">[[ 1 50 42]</div><div class="separator" style="clear: both;">[ 8 66 57]</div><div class="separator" style="clear: both;">[ 5 61 52]</div><div class="separator" style="clear: both;">...</div><div class="separator" style="clear: both;">[ 15 43 73]</div><div class="separator" style="clear: both;">[ 13 41 71]</div><div class="separator" style="clear: both;">[ 9 37 67]]</div><div class="separator" style="clear: both;">...</div><div class="separator" style="clear: both;">[[151 145 140]</div><div class="separator" style="clear: both;">[143 137 132]</div><div class="separator" style="clear: both;">[133 127 122]</div><div class="separator" style="clear: both;">...</div><div class="separator" style="clear: both;">[ 15 36 67]</div><div class="separator" style="clear: both;">[ 12 33 64]</div><div class="separator" style="clear: both;">[ 15 36 67]]</div><div class="separator" style="clear: both;">[[128 122 117]</div><div class="separator" style="clear: both;">[135 129 124]</div><div class="separator" style="clear: both;">[145 139 134]</div><div class="separator" style="clear: both;">...</div><div class="separator" style="clear: both;">[ 17 38 69]</div><div class="separator" style="clear: both;">[ 19 40 71]</div><div class="separator" style="clear: both;">[ 23 44 75]]</div><div class="separator" style="clear: both;">[[151 145 140]</div><div class="separator" style="clear: both;">[153 147 142]</div><div class="separator" style="clear: both;">[156 150 145]</div><div class="separator" style="clear: both;">...</div><div class="separator" style="clear: both;">[ 22 43 74]</div><div class="separator" style="clear: both;">[ 23 44 75]</div><div class="separator" style="clear: both;">[ 21 42 73]]]</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"><span style="color: #2b00fe;">L16 lmList</span> </div></div><div class="separator" style="clear: both;">[[331, 126], [334, 121], [336, 121], [338, 121], [328, 121], [326, 121], [324, 121], [339, 124], [322, 124], [335, 133], [328, 132], [355, 163], [306, 163], [357, 215], [299, 214], [371, 199], [289, 199], [376, 194], [283, 191], [376, 191], [281, 188], [374, 192], [283, 189], [344, 254], [316, 255], [358, 328], [301, 332], [368, 400], [291, 400], [365, 409], [294, 410], [374, 422], [283, 423]]</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"><span style="color: #2b00fe;">L17 detector.findAngle(lmList[24], lmList[26], lmList[28], img)</span> </div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;">[ 15, 36, 67],</div><div class="separator" style="clear: both;">[ 12, 33, 64],</div><div class="separator" style="clear: both;">[ 15, 36, 67]],</div><div class="separator" style="clear: both;">[[128, 121, 118],</div><div class="separator" style="clear: both;">[135, 128, 125],</div><div class="separator" style="clear: both;">[145, 138, 135],</div><div class="separator" style="clear: both;">...,</div><div class="separator" style="clear: both;">[ 17, 38, 69],</div><div class="separator" style="clear: both;">[ 19, 40, 71],</div><div class="separator" style="clear: both;">[ 23, 44, 75]],</div><div class="separator" style="clear: both;">[[151, 144, 141],</div><div class="separator" style="clear: both;">[153, 146, 143],</div><div class="separator" style="clear: both;">[156, 149, 146],</div><div class="separator" style="clear: both;">...,</div><div class="separator" style="clear: both;">[ 22, 43, 74],</div><div class="separator" style="clear: both;">[ 23, 44, 75],</div><div class="separator" style="clear: both;">[ 21, 42, 73]]], dtype=uint8))</div><div class="separator" style="clear: both;">(178.20385684750428, array([[[ 1, 47, 40],</div><div class="separator" style="clear: both;">[ 10, 66, 57],</div><div class="separator" style="clear: both;">[ 12, 70, 61],</div><div class="separator" style="clear: both;">...,</div><div class="separator" style="clear: both;">[ 16, 44, 74],</div><div class="separator" style="clear: both;">[ 20, 48, 78],</div><div class="separator" style="clear: both;">[ 18, 46, 76]],</div><div class="separator" style="clear: both;">[[ 0, 48, 40],</div><div class="separator" style="clear: both;">[ 8, 66, 57],</div><div class="separator" style="clear: both;">[ 1, 56, 47],</div><div class="separator" style="clear: both;">...,</div><div class="separator" style="clear: both;">[ 16, 44, 74],</div><div class="separator" style="clear: both;">[ 16, 44, 74],</div><div class="separator" style="clear: both;">[ 13, 41, 71]],</div><div class="separator" style="clear: both;">[[ 1, 50, 42],</div><div class="separator" style="clear: both;">[ 8, 66, 57],</div><div class="separator" style="clear: both;">[ 5, 61, 52],</div><div class="separator" style="clear: both;">...,</div><div class="separator" style="clear: both;">[ 15, 43, 73],</div><div class="separator" style="clear: both;">[ 13, 41, 71],</div><div class="separator" style="clear: both;">[ 9, 37, 67]],</div><div class="separator" style="clear: both;">...,</div><div class="separator" style="clear: both;">[[151, 144, 141],</div><div class="separator" style="clear: both;">[143, 136, 133],</div><div class="separator" style="clear: both;">[133, 126, 123],</div><div class="separator" style="clear: both;">...,</div><div class="separator" style="clear: both;">[ 15, 36, 67],</div><div class="separator" style="clear: both;">[ 12, 33, 64],</div><div class="separator" style="clear: both;">[ 15, 36, 67]],</div><div class="separator" style="clear: both;">[[128, 121, 118],</div><div class="separator" style="clear: both;">[135, 128, 125],</div><div class="separator" style="clear: both;">[145, 138, 135],</div><div class="separator" style="clear: both;">...,</div><div class="separator" style="clear: both;">[ 17, 38, 69],</div><div class="separator" style="clear: both;">[ 19, 40, 71],</div><div class="separator" style="clear: both;">[ 23, 44, 75]],</div><div class="separator" style="clear: both;">[[151, 144, 141],</div><div class="separator" style="clear: both;">[153, 146, 143],</div><div class="separator" style="clear: both;">[156, 149, 146],</div><div class="separator" style="clear: both;">...,</div><div class="separator" style="clear: both;">[ 22, 43, 74],</div><div class="separator" style="clear: both;">[ 23, 44, 75],</div><div class="separator" style="clear: both;">[ 21, 42, 73]]], dtype=uint8))</div></div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"><span style="color: #2b00fe;">L17 angle</span> 177.34243016028947</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"><span style="color: #2b00fe;">L17 img</span> </div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"> [ 15 36 67]</div><div class="separator" style="clear: both;"> [ 12 33 64]</div><div class="separator" style="clear: both;"> [ 15 36 67]]</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"> [[128 122 117]</div><div class="separator" style="clear: both;"> [135 129 124]</div><div class="separator" style="clear: both;"> [145 139 134]</div><div class="separator" style="clear: both;"> ...</div><div class="separator" style="clear: both;"> [ 17 38 69]</div><div class="separator" style="clear: both;"> [ 19 40 71]</div><div class="separator" style="clear: both;"> [ 23 44 75]]</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"> [[151 145 140]</div><div class="separator" style="clear: both;"> [153 147 142]</div><div class="separator" style="clear: both;"> [156 150 145]</div><div class="separator" style="clear: both;"> ...</div><div class="separator" style="clear: both;"> [ 22 43 74]</div><div class="separator" style="clear: both;"> [ 23 44 75]</div><div class="separator" style="clear: both;"> [ 21 42 73]]]</div><div class="separator" style="clear: both;">[[[ 1 47 40]</div><div class="separator" style="clear: both;"> [ 10 66 57]</div><div class="separator" style="clear: both;"> [ 12 70 61]</div><div class="separator" style="clear: both;"> ...</div><div class="separator" style="clear: both;"> [ 16 44 74]</div><div class="separator" style="clear: both;"> [ 20 48 78]</div><div class="separator" style="clear: both;"> [ 18 46 76]]</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"> [[ 0 48 40]</div><div class="separator" style="clear: both;"> [ 8 66 57]</div><div class="separator" style="clear: both;"> [ 1 56 47]</div><div class="separator" style="clear: both;"> ...</div><div class="separator" style="clear: both;"> [ 16 44 74]</div><div class="separator" style="clear: both;"> [ 16 44 74]</div><div class="separator" style="clear: both;"> [ 13 41 71]]</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"> [[ 1 50 42]</div><div class="separator" style="clear: both;"> [ 8 66 57]</div><div class="separator" style="clear: both;"> [ 5 61 52]</div><div class="separator" style="clear: both;"> ...</div><div class="separator" style="clear: both;"> [ 15 43 73]</div><div class="separator" style="clear: both;"> [ 13 41 71]</div><div class="separator" style="clear: both;"> [ 9 37 67]]</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"> ...</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"> [[151 144 141]</div><div class="separator" style="clear: both;"> [143 136 133]</div><div class="separator" style="clear: both;"> [133 126 123]</div><div class="separator" style="clear: both;"> ...</div><div class="separator" style="clear: both;"> [ 15 36 67]</div><div class="separator" style="clear: both;"> [ 12 33 64]</div><div class="separator" style="clear: both;"> [ 15 36 67]]</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"> [[128 121 118]</div><div class="separator" style="clear: both;"> [135 128 125]</div><div class="separator" style="clear: both;"> [145 138 135]</div><div class="separator" style="clear: both;"> ...</div><div class="separator" style="clear: both;"> [ 17 38 69]</div><div class="separator" style="clear: both;"> [ 19 40 71]</div><div class="separator" style="clear: both;"> [ 23 44 75]]</div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"> [[151 144 141]</div><div class="separator" style="clear: both;"> [153 146 143]</div><div class="separator" style="clear: both;"> [156 149 146]</div><div class="separator" style="clear: both;"> ...</div><div class="separator" style="clear: both;"> [ 22 43 74]</div><div class="separator" style="clear: both;"> [ 23 44 75]</div><div class="separator" style="clear: both;"> [ 21 42 73]]]</div></div></div><div class="separator" style="clear: both; text-align: center;"><br /></div></div><h1>原理探討</h1><p class="MsoNormal" style="mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;">從上小節一步一腳印地以土法煉綱的方式將程式中的每一個存放資料的變數印在 Thonny 的「互動環境(Shell)」中一一檢視。我們試圖以達文西的解剖術,一刀刀的拆解出基元後再拼湊出藏在程式碼背後的密碼──<b>流程圖(flowchart)</b>。</p><p class="MsoNormal" style="mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;">本範例以右大腿和小腿間因直立/深蹲所造成的<b>夾角(angle)</b>變化來判斷動作的完成與否。角度計算函式 findAngle() (定義於 <span style="background-color: white;">PoseModule.py 中</span><span style="text-indent: 24pt;">)以「髖骨─膝蓋─腳踝」三點的座標計算之(圖 5):</span></p><div style="text-align: center;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";"><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: justify;"><div class="separator" style="clear: both;"></div><blockquote><div class="separator" style="clear: both;"><span style="color: red;">蹲下, <span style="font-family: Symbol; font-size: 12pt;">£ </span>105 </span></div><div class="separator" style="clear: both;"><span style="color: red;">直立, <span style="font-family: Symbol; font-size: 12pt;">³ </span>170</span></div></blockquote><div class="separator" style="clear: both;"></div></div><p></p><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEgvjqJGcLC5VgzIMWb7dR6M6XhPOiA44D7d9mLJUXX-xeVudplTXA_2StDQ2_BPtA0iWNNHqk8M4PGQpePYNzXak4_nrtmDjl8J0sCCd8pqJBFqjlK-7qNg6TeaDs1c9I-IJcQaG0W413YUv2Pq9RJ3UJZzB-yk6KHQTS5HBD5m_jsJRyi2IIWK_g" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="82" data-original-width="405" height="130" src="https://blogger.googleusercontent.com/img/a/AVvXsEgvjqJGcLC5VgzIMWb7dR6M6XhPOiA44D7d9mLJUXX-xeVudplTXA_2StDQ2_BPtA0iWNNHqk8M4PGQpePYNzXak4_nrtmDjl8J0sCCd8pqJBFqjlK-7qNg6TeaDs1c9I-IJcQaG0W413YUv2Pq9RJ3UJZzB-yk6KHQTS5HBD5m_jsJRyi2IIWK_g" width="640" /></a></div><span style="font-size: x-small;"><a name="_Ref111620918"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">圖</span></a><span style="mso-bookmark: _Ref111620918;"><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> </span></span><!--[if supportFields]><span
style='mso-bookmark:_Ref111620918'></span><span style='mso-element:field-begin'></span><span
style='mso-bookmark:_Ref111620918'><span lang=EN-US style='font-family:"Times New Roman",serif;
mso-fareast-font-family:標楷體'><span style='mso-spacerun:yes'> </span>SEQ </span></span><span
style='mso-bookmark:_Ref111620918'><span style='font-family:標楷體;mso-ascii-font-family:
"Times New Roman";mso-hansi-font-family:"Times New Roman";mso-bidi-font-family:
"Times New Roman"'>圖</span></span><span style='mso-bookmark:_Ref111620918'><span
lang=EN-US style='font-family:"Times New Roman",serif;mso-fareast-font-family:
標楷體'> \* ARABIC <span style='mso-element:field-separator'></span></span></span><![endif]--><span style="mso-bookmark: _Ref111620918;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><span style="mso-no-proof: yes;">5</span></span></span><!--[if supportFields]><span
style='mso-bookmark:_Ref111620918'></span><span style='mso-element:field-end'></span><![endif]--><span style="mso-bookmark: _Ref111620918;"></span><span style="mso-bookmark: _Ref111620918;"></span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">:<span style="font-family: Times New Roman, serif;">深蹲動作的角度值範例判斷</span></span></span></div></div></div><div class="separator" style="clear: both; text-align: justify;"><br /></div><div class="separator" style="clear: both; text-align: justify;"><p class="MsoNormal" style="mso-char-indent-count: 2.0; text-indent: 24pt; text-justify: inter-ideograph;"><span style="text-indent: 24pt;">另一方面,深蹲的判別及其</span><span style="text-align: center; text-indent: 24pt;">次數計算方式為(圖 6):</span></p><div style="text-align: center;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"></div><blockquote><div class="separator" style="clear: both;"><span style="color: red;">dir = 0,站直,count <- count + 0.5(蹲半下)</span></div><div class="separator" style="clear: both;"><span style="color: red;">dir = 1,蹲下,count <- count + 0.5(蹲半下)</span></div></blockquote><div class="separator" style="clear: both;"></div></div><div class="separator" style="clear: both; text-align: justify;">其中,「<-」表示<b>指定(assign)</b>,意即將符號右邊的值指定給左邊(將計次變數 count 加上蹲半下 0.5 後指定到 count 之中)。</div><div class="separator" style="clear: both; text-align: justify;"><br /></div></div></span></div></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEhQXCaxCmQAAaE3S-3bRtuRwDFj9aWQ4T3bqr_h6IjboF-j7kvFUIthmRQnwjqh4jNSiLjbTF-N-OSQxkN78xLCAAGLf0ve_VDF3sFisEIxcVeRzEvfk2OgcK2ZMBGmMqMG2wO4xwuIcn5RoA3l93zX4YS20yH-gi4Opbuz9_n60Wj6p6oJLRuf0Q" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="265" data-original-width="508" height="334" src="https://blogger.googleusercontent.com/img/a/AVvXsEhQXCaxCmQAAaE3S-3bRtuRwDFj9aWQ4T3bqr_h6IjboF-j7kvFUIthmRQnwjqh4jNSiLjbTF-N-OSQxkN78xLCAAGLf0ve_VDF3sFisEIxcVeRzEvfk2OgcK2ZMBGmMqMG2wO4xwuIcn5RoA3l93zX4YS20yH-gi4Opbuz9_n60Wj6p6oJLRuf0Q=w640-h334" width="640" /></a></div><span style="font-size: x-small;">圖 6:深蹲動作的判別及計次</span><br /><br /></div><div class="separator" style="clear: both; text-align: justify;">因此,我們可以整理出程式的執行流程如圖 7 所示。</div><div class="separator" style="clear: both; text-align: center;"><br /></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEhRHkgv0rrg4IdBijFkjhbocMx4Lem8PcPTr_y0ogbnZlw6jX9EurGn3tXKmL9npv95QtUi-NCvABqylkcYHwwtszZtYrUQZsVcd3T2Ao99sjm_PPhtvv89FiZ4IN4y3tGRPDVpg0Ynhc00BVbrvygHf0tR32fhCkJ7XKq__Z_-StObBYgNS3SwXQ" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="588" data-original-width="684" height="551" src="https://blogger.googleusercontent.com/img/a/AVvXsEhRHkgv0rrg4IdBijFkjhbocMx4Lem8PcPTr_y0ogbnZlw6jX9EurGn3tXKmL9npv95QtUi-NCvABqylkcYHwwtszZtYrUQZsVcd3T2Ao99sjm_PPhtvv89FiZ4IN4y3tGRPDVpg0Ynhc00BVbrvygHf0tR32fhCkJ7XKq__Z_-StObBYgNS3SwXQ=w640-h551" width="640" /></a></div></div><span style="font-size: x-small;">圖 7:本文的流程圖</span></span></div><div style="text-align: left;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";"><br /></span></div><h1><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">進階問題</span></h1><p class="MsoListParagraph" style="background: white; margin-left: 24pt; mso-list: l0 level1 lfo1; mso-para-margin-left: 0gd; text-align: justify; text-indent: -24pt; text-justify: inter-ideograph;"><!--[if !supportLists]--></p><div style="mso-element: footnote-list;"><ol style="text-align: left;"><li>將「夾角」的偵測擴充到四足,讓程式可以判斷出四手腳的動作。</li><li>找一個運動的肢體變化過程,例如國標舞舞步,將深蹲改寫為「國標舞 AI 教練」。</li><li>請模仿我們先前拙著《AI 成績查詢系統》(<a href="https://vmaker.tw/archives/57591" target="_blank">https://reurl.cc/YdzLAX</a>》一文,使用 fChart 內建的 Tinker <b>視窗設計工具包(GUI toolkit)</b>,替本文訂製一個使用者界面。</li><li>參考拙著《Python玩AI,你也可以 – 從CVZone入門吧!》(<a href="https://makerpro.cc/2021/12/run-deep-learning-with-python/" target="_blank">https://reurl.cc/AyZGkE</a>),將測試資料置換成由攝影機餵入的<b>即時(real-time)</b>影像資料。</li></ol></div><div style="mso-element: footnote-list;"><hr align="left" size="1" width="33%" /><!--[endif]--><div id="ftn1" style="mso-element: footnote;"><div style="text-align: justify;"><span style="font-size: x-small;">[1] <a href="http://creativecommons.tw/explore" style="color: #2288bb; font-family: times, "times new roman", serif; text-decoration-line: none;" target="_blank">六種授權條款</a><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;">。</span></span></div><div style="text-align: justify;"><span style="font-size: x-small;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;">[2] <a href="https://fchart.github.io/python/index.html?fbclid=IwAR3WWon6lJEDm1HL6npOK4ZAnkBOMst67kh7SQhT75Ghc5ZYnA3ms4EiWF4" target="_blank">https://reurl.cc/gQ59Vb</a> 中的「</span></span><span style="font-size: x-small;"><span style="color: #222222;">fChart_CVZone工具」連結</span><span style="color: #222222;">。</span></span></div></div></div>Ted Leehttp://www.blogger.com/profile/03077454870590095355noreply@blogger.com0tag:blogger.com,1999:blog-1468347421357730785.post-65962346205835509202022-12-30T18:46:00.028+08:002023-01-01T08:18:11.276+08:00[遞迴, Recursion, fChart, Python] 以 fChart 馭 Python:遞迴函數(Recursive Functions)(11/11)<h1 style="text-align: center;"> <span style="text-align: center;">以 fChart 馭 Python:<br /></span>遞迴函數(Recursive Functions)</h1><div style="background-color: white; text-align: center;"><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><a href="https://www.facebook.com/groups/134149180510967/" style="color: #2288bb; text-decoration-line: none;" target="_blank"><span style="font-family: times, "times new roman", serif;">Ted Lee的土饅頭(To Mentor)工坊</span></a></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><div><span style="font-family: times, "times new roman", serif;">Line:ted2016.kpvs</span><br /><span style="font-family: times, "times new roman", serif;">Email:<a href="mailto:Lct4246@gmail.com" target="_blank">Lct4246@gmail.com</a></span><br /><span style="font-family: times, "times new roman", serif;"><span style="font-family: "times new roman", serif;">FB</span>:<a href="http://gg.gg/TedLeeFB/" target="_blank"><span style="font-family: "times new roman", serif;">http://gg.gg/</span><span style="color: #00cc00; font-family: "times new roman", serif;">TedLee</span><span style="color: red; font-family: "times new roman", serif;">FB</span><span style="font-family: "times new roman", serif;">/</span></a></span></div><div><span lang="" style="font-family: times, "times new roman", serif; font-size: 12pt;">Blog<span style="font-family: "times new roman"; font-size: small;">:</span><a href="http://gg.gg/TedLeeBlog/" target="_blank">http://gg.gg/<span style="color: #00cc00;">TedLee</span><span style="color: red;">Blog</span>/</a></span><br /></div></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><span style="font-family: times, "times new roman", serif;"><br /></span></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><span style="font-family: times, "times new roman", serif;">Dec. 30, 2022</span></div><div><span><span style="color: #222222; font-family: times, "times new roman", serif;"><span style="font-size: 13.2px;"><div class="separator" style="clear: both;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s88/CC.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="31" data-original-width="88" height="31" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s1600/CC.png" width="88" /></a>[1]</div></span></span><div class="separator" style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: left;"><br /></div><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify;"><span style="color: #222222;">遞迴是程式自己呼叫自己的一種</span><span style="color: red;">抽絲剝繭</span><span style="color: #222222;">的解題計巧。</span></div><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify;"><span style="color: #222222;">因為這類的大問題是由其</span><span style="color: red;">相同型式(pattern)</span><span style="color: #222222;">的小問題所<b>疊代(iterate)</b>而增長而成的。所以,當<b>問題空間(problem space)</b>降低至易於處理的<b>小大(size)</b>時,我們就很容易從小問題的答案再往上一層一層</span><span style="color: #222222;"><b>回溯(backtrack)</b>而</span><span style="color: #222222;">組合出原大問題的解答。例如:欲求</span><b style="color: #222222;">數列(sequence)</b><span style="color: #222222;"> 1, 1, 2, 3, 5, ... 的第 10 項為何數字,我們可以發現,這串數列好像有一個<b>隱含的規律(implicit regularity)</b>是:第 i 項是前兩項 (i-2), (i-1) 的和,當 i > 2 時。例如:5 = 3 + 2。</span></div><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify;"><span style="color: #222222;">在</span>表 1 的「10 大項目之 10」<span style="color: #222222;">的 4 個實例</span><span style="color: #222222; text-align: center; white-space: pre-wrap;">(可從 <a href="https://drive.google.com/file/d/1MZZo1YsCEZE39_79Kdiphl3ruWcO0FoD/view?usp=share_link" target="_blank">https://reurl.cc/bGbkqM</a> </span><span style="color: #222222; text-align: center; white-space: pre-wrap;">下載)中將探討<b>電腦科學(Computer Science,CS)</b>中這類的<b>經典(classical)</b>遞迴問題──</span></div><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify;"><span style="color: #222222; text-align: center; white-space: pre-wrap;"><br /></span></div><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify;"><span style="color: #222222; text-align: center; white-space: pre-wrap;"></span><blockquote><span style="color: #222222; text-align: center; white-space: pre-wrap;">將大問題<b>拆解(divide)</b>為小問題,再將小問題的答案逐步<b>組合(combine)</b>為大問題的解答</span><span style="color: #222222;">。前題:大問題和小問題具有相同的<b>結構性(structure)</b>!</span></blockquote><span style="color: #222222;"></span></div><div class="separator" style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;"><div class="separator" style="clear: both; text-align: center; white-space: pre-wrap;"><div class="separator"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><span style="font-size: x-small;">表 1:10 大項目之 10</span></div></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; font-size: 13.2px;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEhVFMGXsJNuH8Q2u5hz9vaarJKi6tPI6bI09dk9b_io3oog6870SJJ4FFz5m6WN2kfYvT6s-XOzE8grtq8R1uyhkTuY-pPXQ03l9Q7jHCDEJu7c0Pkkao9595QpFjBdw9v55Orv2K924cbBnzRKGV6r5Ry1Ut3PQNjY0bQ36ccnkFMF1D_FHgjwiw" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="176" data-original-width="721" height="157" src="https://blogger.googleusercontent.com/img/a/AVvXsEhVFMGXsJNuH8Q2u5hz9vaarJKi6tPI6bI09dk9b_io3oog6870SJJ4FFz5m6WN2kfYvT6s-XOzE8grtq8R1uyhkTuY-pPXQ03l9Q7jHCDEJu7c0Pkkao9595QpFjBdw9v55Orv2K924cbBnzRKGV6r5Ry1Ut3PQNjY0bQ36ccnkFMF1D_FHgjwiw=w640-h157" width="640" /></a></div></div></div></div></div></div></div></div></div></div></div></div></div></div><div class="separator" style="clear: both; text-align: center; white-space: pre-wrap;"><span><a name="more"></a></span></div></div><h2 style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;">遞迴分析</h2><div style="text-align: justify;">在本小節中,我們甞試使用<b>運算思維(computational thinking)</b>的法則來分析費式數列問題:</div><div style="text-align: justify;">步驟 1:<b>拆解(decomposition)</b>。我們設計了表 2 的費氏數列空白<b>觀察表(observation table)</b>來推敲此數列的<b>生成(generate)</b>過程。其結果如表 3 所示。</div><div><div class="separator" style="clear: both;"> </div><span style="font-size: x-small;">表 2:空白觀察表</span><br /></div><div><span><div class="separator" style="clear: both; font-size: small; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEhYxH1Gqv_gxecILTHqat7x-gc-TPnAH6e0vgo_TWGNuUNaWsxPm0rvcciakRfZiwTIkybeqUprsbvWrnITUBow5U7_yevX9D0Gt07zHFaZXs4olq2KsqB8XJrEhGle6oeto1nqCFgkcIcB5oOD9RjpBgLD40Ww39gX4r98bxuBdwpH1tONC5_RTQ" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="537" data-original-width="500" height="240" src="https://blogger.googleusercontent.com/img/a/AVvXsEhYxH1Gqv_gxecILTHqat7x-gc-TPnAH6e0vgo_TWGNuUNaWsxPm0rvcciakRfZiwTIkybeqUprsbvWrnITUBow5U7_yevX9D0Gt07zHFaZXs4olq2KsqB8XJrEhGle6oeto1nqCFgkcIcB5oOD9RjpBgLD40Ww39gX4r98bxuBdwpH1tONC5_RTQ" width="223" /></a></div><div class="separator" style="clear: both; text-align: center;"><br /></div><div class="separator" style="clear: both; text-align: center;"><div style="font-size: medium;"><span style="font-size: x-small;">表 3:費氏數列前十項觀察表</span></div><div style="font-size: medium;"><span style="font-size: small;"><div class="separator" style="clear: both;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjzg0cen-tHHkXzqzNhx8jATIB5S55V1Z9yLv2bqTmrrZ_YT_I2oAZc0pcnJ9cpIkr1bIjnLAICVFUst3WHAHyiTJquW40lmgBiMMZ08DGnj3xAwL18xe0frz1hdXAhiW8I6SPvSb_bZYCUQK12AJOKcCzQIKXH4Z5dfSIX2g8P2fjBWD35YR57Rg" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="531" data-original-width="499" height="240" src="https://blogger.googleusercontent.com/img/a/AVvXsEjzg0cen-tHHkXzqzNhx8jATIB5S55V1Z9yLv2bqTmrrZ_YT_I2oAZc0pcnJ9cpIkr1bIjnLAICVFUst3WHAHyiTJquW40lmgBiMMZ08DGnj3xAwL18xe0frz1hdXAhiW8I6SPvSb_bZYCUQK12AJOKcCzQIKXH4Z5dfSIX2g8P2fjBWD35YR57Rg" width="226" /></a></div></span></div></div><br /></div><div style="text-align: left;">步驟 2:<b>模式辨別(pattern recognition)</b>。從表 3 中,我們似乎可以看出 <span style="color: red;">5</span> = 2 + 3,即</div><div style="text-align: left;"><blockquote>第 n 項的值為前兩項之和。</blockquote></div><div style="text-align: justify;">步驟 3:<b>抽像化(abstraction)</b>。根據以上的觀察,我們大膽的以圖 1 這個遞迴公式(recurrence formula)來猜測費氏數列的表現。註:讀者們可援用<b>數學歸納法(athematical inducation)</b>來證明它的正確性。</div><div style="text-align: left;"><br /></div><div style="text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEimoeKBqAuH5tnBDsLGsavu7Ido9-Z-pE-UGwys55NBIo7qCHxnloJuRZqywMpBggpbJ6URR5xR52EylhJiHRSYUJApmRZ4qMIJyijruBQGKeuGg6Rdc6fA28N4NQwD6UsoDY8L7hYiQYCI20zJv7EP4T2zE_Gc8baUC-6ph8cS_rv765ATiPsNEQ" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="82" data-original-width="326" height="80" src="https://blogger.googleusercontent.com/img/a/AVvXsEimoeKBqAuH5tnBDsLGsavu7Ido9-Z-pE-UGwys55NBIo7qCHxnloJuRZqywMpBggpbJ6URR5xR52EylhJiHRSYUJApmRZ4qMIJyijruBQGKeuGg6Rdc6fA28N4NQwD6UsoDY8L7hYiQYCI20zJv7EP4T2zE_Gc8baUC-6ph8cS_rv765ATiPsNEQ" width="320" /></a></div><span style="font-size: x-small;">圖 1:費費數列的遞迴公式</span><br /><br /></div><div style="text-align: left;">步驟 4:<b>演算法(algorithm)</b>。根據圖 1 的公式,我們可以圖 2 的流程圖來表式費氏數列的演算方法。</div><div style="text-align: left;"><br /></div><div style="text-align: center;"><span style="font-size: small;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEhsS8XhBBJRtFv6M2eTDusRAMrH4ChM2JPFjjEYFori6ggnRILm1MB868WsgJTVT4GDLGDVmgSiR4tS64fXq_Ko8RLQF9K6Xq6WcJNh8ci_l13p04sRGAaVUtVn8dd2zT4PJ5FmNFJTYmQL9_qGbf1RK4XflKw7jQdK3pFhdmd0Q--oXmnOXVlUXw" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="512" data-original-width="381" height="400" src="https://blogger.googleusercontent.com/img/a/AVvXsEhsS8XhBBJRtFv6M2eTDusRAMrH4ChM2JPFjjEYFori6ggnRILm1MB868WsgJTVT4GDLGDVmgSiR4tS64fXq_Ko8RLQF9K6Xq6WcJNh8ci_l13p04sRGAaVUtVn8dd2zT4PJ5FmNFJTYmQL9_qGbf1RK4XflKw7jQdK3pFhdmd0Q--oXmnOXVlUXw=w298-h400" width="298" /></a></div></span></div><div style="text-align: center;"><span style="font-size: x-small;">圖 2:費式數列的流程圖</span></div></span></div><div style="text-align: justify;"><br /></div><span><a name="more"></a></span><h2 style="text-align: justify;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; text-align: left;">原始問題</span></h2><div class="separator" style="clear: both; text-align: left;"><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify; white-space: pre-wrap;"><div class="separator" style="clear: both; white-space: normal;"><div class="separator" style="clear: both; white-space: pre-wrap;"><span><span style="color: #222222;">本文只詳述「</span></span><span style="font-family: "Times New Roman"; white-space: normal;">10-02.呼叫Fib函數</span><span style="font-family: "Times New Roman"; white-space: normal;">」:請計算<b>費氏數列(Fibnacci number)</b>第六項的值,</span><span style="color: black;"><span><span><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjwotTXNzJDM94qB0017OMEvLI1s0e_My86pnQxzy9K6-8Q-K6_uRo8ykdt7O6Yf5YNY4yOvjNDnxNLQiyJTHQQKlh8ZSiAqcPhjbqSHzDkJVGLyuxdH3K9Sndvb2Z_tw5FaNOYQ753_8_Da_SbsiAUhx5T_XURl-2Pz0QfiIIWY_wOULFPYrrnyA" style="color: #222222; margin-left: 1em; margin-right: 1em; text-align: center;"><img alt="" data-original-height="67" data-original-width="152" height="64" src="https://blogger.googleusercontent.com/img/a/AVvXsEjwotTXNzJDM94qB0017OMEvLI1s0e_My86pnQxzy9K6-8Q-K6_uRo8ykdt7O6Yf5YNY4yOvjNDnxNLQiyJTHQQKlh8ZSiAqcPhjbqSHzDkJVGLyuxdH3K9Sndvb2Z_tw5FaNOYQ753_8_Da_SbsiAUhx5T_XURl-2Pz0QfiIIWY_wOULFPYrrnyA=w144-h64" width="144" /></a></span></span></span><span style="color: black;">。</span>其他三例請讀者們自行練習<span style="color: #222222;">。</span></div></div></div><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="text-align: justify;"><div class="separator" style="clear: both; text-align: left;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="text-align: justify;"><span style="color: black;"><br /></span></span></div></span></div><div class="separator" style="clear: both; text-align: left;"><div class="separator" style="clear: both;"><span style="text-align: justify;"><div class="separator" style="clear: both; text-align: left;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; text-align: justify;"><div class="separator" style="clear: both; font-weight: bold; text-align: left;"><span><a name="more"></a></span></div><div class="separator" style="clear: both; font-weight: bold; text-align: left;"><h2 style="clear: both;"></h2></div></span></div><div class="separator" style="clear: both; text-align: left;"><h2 style="clear: both; text-align: justify;"><span style="color: #222222; text-align: left;">流程圖與 Python 語法對轉</span></h2></div></span></div></div><div class="separator" style="clear: both; text-align: left;"><div class="separator" style="clear: both;"><div style="text-align: justify;"><h3><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span><span style="font-weight: 400;">首先,</span><span>函數(function)</span><span style="font-weight: 400;">的語法請參考前著「以 fChart 馭 Python:函數」(<a href="https://makerpro.cc/2022/09/use-fchart-to-learn-python-part-eight/">https://reurl.cc/aablVZ</a>)一文。緊接著,從圖 中我們可以看到 Fib(n) = t1 + t2 = Fib(n - 1) + Fib(n - 2),n = 6。其中,</span></span></span></span></div><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span><span style="font-weight: 400;"><br /></span></span></span></span></div><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span><span style="font-weight: 400;">Fib(6)</span></span></span></span></div><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span><span style="font-weight: 400;">= Fib(5) + Fib(4)</span></span></span></span></div><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span><span style="font-weight: 400;">= [Fib(4) + Fib(3)] + Fib(4) = 2 * Fib(4) + Fib(3)</span></span></span></span></div><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span><span style="font-weight: 400;">= 2 * [Fib(3) + Fib(2)] + Fib(2) + Fib(1) = 2 * Fib(3) + 3* Fib(2) + 1 = 2 * Fib(3) + 3 * 1 + 1 = 2 * Fib(3) + 4</span></span></span></span></div><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span><span style="font-weight: 400;">= 2 * [Fib(2) + Fib(1)] + 4 = 2 * [1 + 1] + 4 = 8</span></span></span></span></div><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span><span style="font-weight: 400;"><br /></span></span></span></span></div><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span><span style="font-weight: 400;">遞迴程式的撰寫格式為:</span></span></span></span></div><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span><span style="font-weight: 400;"></span></span></span></span></div><blockquote><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif"><span style="font-size: small;"><span><span style="color: red; font-weight: 400;">def Fib(n):</span></span></span></span></div><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif"><span style="font-size: small;"><span><span style="color: red; font-weight: 400;"> if (n <= 2):</span></span></span></span></div><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif"><span style="font-size: small;"><span><span style="color: red; font-weight: 400;"> return (Fib(n - 1) + Fib(n - 2)</span></span></span></span></div><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif"><span style="font-size: small;"><span><span style="color: red; font-weight: 400;"> else:</span></span></span></span></div><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif"><span style="font-size: small;"><span><span style="color: red; font-weight: 400;"> return 1</span></span></span></span></div></blockquote><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif"><span style="font-size: small;"><span><span style="color: red; font-weight: 400;"></span></span></span></span></div><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span><span style="font-weight: 400;">數後,根據流程圖</span></span></span></span><span style="font-size: small;"><span style="color: #222222; font-weight: 400; text-align: right;"><span><span><span style="color: black;">將 </span></span></span></span><span style="color: black; font-weight: 400; text-align: left;">Python 程式</span><span style="color: black; font-weight: 400; text-align: left;">轉換妥後</span><span style="color: black; font-weight: 400;">以「</span><span style="color: black; text-align: center;"><span><span style="font-weight: 400; white-space: pre-wrap;"><span style="text-align: justify; white-space: normal;">10-02.呼叫Fib函數</span>.py」存檔執行</span></span></span><span style="color: black; font-weight: 400;">後就能看到</span><span style="color: black; font-weight: 400; text-align: left;">如圖 3</span><span style="color: black; font-weight: 400; text-align: left;"> 所對應的</span><span style="color: black; font-weight: 400;">執行結果。</span></span></div><div class="separator" style="clear: both;"><span style="font-size: small;"><span style="color: black; font-weight: 400;"><br /></span></span></div></h3><h3><div class="separator" style="clear: both; font-size: medium; font-weight: 400;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="color: black; font-size: small;"><div></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="text-align: justify;"><span></span></div></div></div></span></span></div></h3><h3><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span style="font-weight: 400;"></span></span></span></div><div class="separator" style="clear: both; font-weight: 400; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><div class="separator" style="clear: both; font-size: medium;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjkGDn7xREtwE453XcjS2-W4xoTK2gfGsf3fX2TG6s0F26WcYyJGsNYkIpiJvSG6lu4H1UdJ0q-LFVLSd-fpF7k6SJgUenOvFC1aHkowh_uG4xzXBrxWajabQcrrQ7cWyIspTb0nFoCNKiMpjX-gOxF425WjxbaoPYJ7F6m3DKlg0WezkH7kTzCRA" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="648" data-original-width="1762" height="236" src="https://blogger.googleusercontent.com/img/a/AVvXsEjkGDn7xREtwE453XcjS2-W4xoTK2gfGsf3fX2TG6s0F26WcYyJGsNYkIpiJvSG6lu4H1UdJ0q-LFVLSd-fpF7k6SJgUenOvFC1aHkowh_uG4xzXBrxWajabQcrrQ7cWyIspTb0nFoCNKiMpjX-gOxF425WjxbaoPYJ7F6m3DKlg0WezkH7kTzCRA=w640-h236" width="640" /></a></div></div></div></div></div></div><div class="separator" style="clear: both;"><span style="font-size: x-small;"><span style="color: black;">圖 3:根據流程圖手動轉換為 Python 語法以求得 Fib(6) 之值</span></span></div></span></div></h3></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="text-align: justify;"><span><a name='more'></a></span></div></div></div></div></div></span></div></div><div><div style="background-color: white;"><ol><li style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; margin: 0px 0px 0.25em; padding: 0px; text-align: justify;"><span style="font-size: x-small;"><a href="http://creativecommons.tw/explore" style="background-color: transparent; color: #2288bb; font-family: times, "times new roman", serif; text-decoration-line: none;" target="_blank">六種授權條款</a><span face="arial, tahoma, helvetica, freesans, sans-serif" style="background-color: transparent;">。</span></span></li></ol></div></div>Ted Leehttp://www.blogger.com/profile/03077454870590095355noreply@blogger.com0tag:blogger.com,1999:blog-1468347421357730785.post-78536868839623886322022-12-03T08:10:00.018+08:002022-12-05T01:57:39.979+08:00[演算法, algorithms, fChart,Python] 以 fChart 馭 Python:演算法(Algorithms)(10/11)<h1 style="text-align: center;"> <span style="text-align: center;"> </span><span style="text-align: center;">以 fChart 馭 Python:</span></h1><h1 style="text-align: center;">演算法(Algorithms)</h1><div style="background-color: white; text-align: center;"><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><a href="https://www.facebook.com/groups/134149180510967/" style="color: #2288bb; text-decoration-line: none;" target="_blank"><span style="font-family: times, "times new roman", serif;">Ted Lee的土饅頭(To Mentor)工坊</span></a></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><div><span style="font-family: times, "times new roman", serif;">Line:ted2016.kpvs</span><br /><span style="font-family: times, "times new roman", serif;">Email:<a href="mailto:Lct4246@gmail.com" target="_blank">Lct4246@gmail.com</a></span><br /><span style="font-family: times, "times new roman", serif;"><span style="font-family: "times new roman", serif;">FB</span>:<a href="http://gg.gg/TedLeeFB/" target="_blank"><span style="font-family: "times new roman", serif;">http://gg.gg/</span><span style="color: #00cc00; font-family: "times new roman", serif;">TedLee</span><span style="color: red; font-family: "times new roman", serif;">FB</span><span style="font-family: "times new roman", serif;">/</span></a></span></div><div><span lang="" style="font-family: times, "times new roman", serif; font-size: 12pt;">Blog<span style="font-family: "times new roman"; font-size: small;">:</span><a href="http://gg.gg/TedLeeBlog/" target="_blank">http://gg.gg/<span style="color: #00cc00;">TedLee</span><span style="color: red;">Blog</span>/</a></span><br /></div></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><span style="font-family: times, "times new roman", serif;"><br /></span></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><span style="font-family: times, "times new roman", serif;">Dec. 3, 2022</span></div><div><span><span style="color: #222222; font-family: times, "times new roman", serif;"><span style="font-size: 13.2px;"><div class="separator" style="clear: both;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s88/CC.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="31" data-original-width="88" height="31" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s1600/CC.png" width="88" /></a>[1]</div></span></span><div class="separator" style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: left;"><br /></div><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify;"><span style="color: #222222;">演算法為陳述<b>問題解決(problem solving)</b>的方法,在<b>資訊科學(Computer Science,CS)</b>領域裡,比較關心的是「用電腦」工具來解決問題。在</span>圖1 的「10 大項目之 9」<span style="color: #222222;">的 7 個實例</span><span style="color: #222222; text-align: center; white-space: pre-wrap;">(可從 <a href="https://reurl.cc/RXXDqr" target="_blank">https://reurl.cc/RXXDqr</a> </span><span style="color: #222222; text-align: center; white-space: pre-wrap;">下載)中將探討<b>搜尋(search)</b>與<b>排序(sorting)</b>兩大古典問題</span><span style="color: #222222;">。</span></div><div class="separator" style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;"><div class="separator" style="clear: both; text-align: center; white-space: pre-wrap;"><div class="separator"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; font-size: 13.2px;"><div class="separator" style="clear: both;"><br /></div></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; font-size: 13.2px; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEj7qfBhV6wiPZHd7V_WJ15jYPfuIXMk68NgLfaVLHIdcrJpZ8EsBlrNUJyLTAkW5Twhv2FAvesJrFidA4HqI5xj1Ypn8UL1A9SDdUqbXoOv0zewnc_vkLBHTR_bbLsLgJclyJ-dWcfD93Yg3itUisGxeoyoYC-JRbHdzbSS_Zhz54ckSyvkCZjjJQ" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="155" data-original-width="444" height="112" src="https://blogger.googleusercontent.com/img/a/AVvXsEj7qfBhV6wiPZHd7V_WJ15jYPfuIXMk68NgLfaVLHIdcrJpZ8EsBlrNUJyLTAkW5Twhv2FAvesJrFidA4HqI5xj1Ypn8UL1A9SDdUqbXoOv0zewnc_vkLBHTR_bbLsLgJclyJ-dWcfD93Yg3itUisGxeoyoYC-JRbHdzbSS_Zhz54ckSyvkCZjjJQ" width="320" /></a></div><span style="font-size: x-small;">圖 1:10 大項目之 9</span></div></div></div></div></div></div></div></div></div></div></div></div><div class="separator" style="clear: both; text-align: center; white-space: pre-wrap;"><span><a name="more"></a></span></div></div><h2 style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;">搜尋與排序問題</h2><div style="text-align: justify;">首先,我們先定義資料的搜尋與排列問題。給定一串數字資料:5, 7, 1, 1, 4, 3, 8</div><div style="text-align: justify;"><br /></div><div style="text-align: justify;"></div><blockquote><div style="text-align: justify;">搜尋問題:找出 9 是否在這串資料中?(找不到)</div><div style="text-align: justify;">排序問題:將這串資料由小到大<b>遞增<span style="font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; white-space: pre-wrap;">(ascending)</span></b>排好?(1, 1, 3, 4, 5, 7, 8)</div></blockquote><div style="text-align: justify;"></div><div style="text-align: justify;">初學者可能會很納悶:這不是一眼就能看出答案的小事,怎麼需要如此的大陣仗的在此討論呢?(如果是一千萬筆大數據資料呢?)這其中的關鍵就在:人類的一眼看不等於電腦的看一眼!</div><div style="text-align: justify;">再細部追問題:是否能把人類如何一眼望穿的步驟鉅細靡遺地列出來教會只懂 0101... 的笨電腦呢?</div><div style="text-align: justify;">因此,如何定性的陳述一種搜尋/排序的方法就成為古典電腦科學家所關心的問題了。例如,在 Google 設計的搜尋引擎中,我們下達「泰布布」這個關鍵字後,Google 就會將之與從全網路上所<b>爬(crawl)</b>來的庫儲網頁做比對(搜尋)。然後依照它們的關聯性大小依序列出(排序)。所以,我們就能從圖 2 中找到筆者長期筆耕的部落格入口網址了。</div><div><div class="separator" style="clear: both;"> <div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjDdq-gBl3BugVClOWg55OOThNYKA-Zh6w9upn7nZPcxM-Zw5xXrxTNlK6WBa5Piouv97uvsefr3WyXwH0OBiyA6dB93EsGG_tUfw7CIYa3nAimy5ptz0770w23Z0OlkLTrpHOijcaPO6WGLakOayI0oH8ECZ353Tj1cPQem_Of-qX5blcED_5MdA" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="645" data-original-width="1045" height="397" src="https://blogger.googleusercontent.com/img/a/AVvXsEjDdq-gBl3BugVClOWg55OOThNYKA-Zh6w9upn7nZPcxM-Zw5xXrxTNlK6WBa5Piouv97uvsefr3WyXwH0OBiyA6dB93EsGG_tUfw7CIYa3nAimy5ptz0770w23Z0OlkLTrpHOijcaPO6WGLakOayI0oH8ECZ353Tj1cPQem_Of-qX5blcED_5MdA=w640-h397" width="640" /></a></div></div><span style="font-size: x-small;">圖 2:Google 搜尋引擎</span><br /></div><div style="text-align: justify;"><br /></div><span><a name="more"></a></span><h2 style="text-align: justify;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; text-align: left;">原始問題</span></h2><div class="separator" style="clear: both; text-align: left;"><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify; white-space: pre-wrap;"><div class="separator" style="clear: both; white-space: normal;"><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="color: #222222;">從圖 1 的 7 個實例中,我們各挑了<b>循序搜尋(sequential search)</b>還<b>選擇排序(selection sort)</b>來說明以流程圖來表示</span><span style="color: #222222;">將演算法</span><span style="color: #222222;">後人工轉換到 Python 程式的過程。其中,前者的處理方法是</span><span><span style="color: red;">依序「從到到尾」和原始資料比對要尋找的<b>鍵值(key)</b></span><span style="color: #222222;">(</span><a href="https://www.cs.usfca.edu/~galles/visualization/Search.html" style="color: #222222;">https://reurl.cc/aaenZG</a><span style="color: #222222;">);關於後者,</span><span style="color: red;">每一回合都從尚未排序的資料中選出其值是最小的,並將之依序放到最左手邊以形成由小到大的資料遞增方式放置</span><span style="color: #222222;">(</span><a href="https://visualgo.net/en/sorting" style="color: #222222;">https://reurl.cc/x1N9NE</a><span style="color: #222222;">)。</span></span></div></div></div><span style="color: #222222;"><h4></h4></span><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="text-align: justify;"><div class="separator" style="clear: both; text-align: left;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="text-align: justify;"><span style="color: black;"><span style="color: #222222;">1. </span><span><b>09-01.循序搜尋法</b><span style="color: #222222;">:在資料 [89, 34, 78, 45, 92] 中搜尋輸入的鍵值<a href="https://blogger.googleusercontent.com/img/a/AVvXsEif9gsbnh7Swkl5N0RRBfUZm_Tg2v4lZqOEodhWEyj-pwZ_U-gy_r981Jn9jm3uGziJZQ2onHiNLt_lGmTtPxDGL5UlSKhBTTvr6MWxk_kQzzn0jkmN4QzEdNkSxjpWpx9cUFf5-Lyb1lpftndjjq0Sl1HaofE2y8d39SbM_NkmCgPFnHdWGeEV9Q" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="89" data-original-width="182" height="98" src="https://blogger.googleusercontent.com/img/a/AVvXsEif9gsbnh7Swkl5N0RRBfUZm_Tg2v4lZqOEodhWEyj-pwZ_U-gy_r981Jn9jm3uGziJZQ2onHiNLt_lGmTtPxDGL5UlSKhBTTvr6MWxk_kQzzn0jkmN4QzEdNkSxjpWpx9cUFf5-Lyb1lpftndjjq0Sl1HaofE2y8d39SbM_NkmCgPFnHdWGeEV9Q=w200-h98" width="200" /></a></span></span></span><span style="color: black;">。</span></span></div><span style="color: #222222;">2. </span></span><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="text-align: justify;"><span style="color: #222222;"><b>09-05.選擇排序法</b>:將資料 [12, 11, 10, 15, 1, 2] 以由小到大的遞增方式排列之<a href="https://blogger.googleusercontent.com/img/a/AVvXsEi-yoHGHJTv3jYcw2pSOckT2aByIVUEFWsyMkWBOWN5RLELzB3tF5Pn8KlWteb7Sk7gfhGEAPrEwSYZC-qCIDZYcXyWlo1-KfyYlpARWNGOMqXqzBwqsF6qVZfgBF2KOZdvWW4Hfl1yLJi0P_QpUg9BFj49KDjqFeC0x00MDTHwLbJR20tBSXH3vw" style="margin-left: 1em; margin-right: 1em; text-align: center;"><img alt="" data-original-height="71" data-original-width="217" height="66" src="https://blogger.googleusercontent.com/img/a/AVvXsEi-yoHGHJTv3jYcw2pSOckT2aByIVUEFWsyMkWBOWN5RLELzB3tF5Pn8KlWteb7Sk7gfhGEAPrEwSYZC-qCIDZYcXyWlo1-KfyYlpARWNGOMqXqzBwqsF6qVZfgBF2KOZdvWW4Hfl1yLJi0P_QpUg9BFj49KDjqFeC0x00MDTHwLbJR20tBSXH3vw=w200-h66" width="200" /></a></span></span><span style="text-align: justify;">。</span></div><div class="separator" style="clear: both; text-align: left;"><div class="separator" style="clear: both;"><span style="text-align: justify;"><div class="separator" style="clear: both; text-align: left;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; text-align: justify;"><div class="separator" style="clear: both; font-weight: bold; text-align: left;"><span><a name="more"></a></span></div><div class="separator" style="clear: both; font-weight: bold; text-align: left;"><h2 style="clear: both;"></h2></div></span></div><div class="separator" style="clear: both; text-align: left;"><h2 style="clear: both; text-align: justify;"><span style="color: #222222; text-align: left;">流程圖與 Python 語法對轉</span></h2></div></span></div></div><div class="separator" style="clear: both; text-align: left;"><div class="separator" style="clear: both;"><div style="text-align: justify;"><h3><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span><span style="font-weight: 400;">1.</span><span><span style="font-weight: 400;"> </span></span></span><span>09-01.循序搜尋法<span style="font-weight: 400;">:根據流程圖</span></span></span></span><span style="font-size: small;"><span style="color: #222222; font-weight: 400; text-align: right;"><span><span><span style="color: black;">將 </span></span></span></span><span style="color: black; font-weight: 400; text-align: left;">Python 程式</span><span style="color: black; font-weight: 400; text-align: left;">轉換妥後</span><span style="color: black; font-weight: 400;">以「</span><span style="color: black; text-align: center;"><span><span style="font-weight: 400; white-space: pre-wrap;">09-01.循序搜尋法.py」存檔執行</span></span></span><span style="color: black; font-weight: 400;">後就能看到</span><span style="color: black; font-weight: 400; text-align: left;">如圖 3</span><span style="color: black; font-weight: 400; text-align: left;"> 所對應的</span><span style="color: black; font-weight: 400;">執行結果。</span></span></div><div class="separator" style="clear: both;"><span style="font-size: small;"><span style="color: black; font-weight: 400;"><br /></span></span></div></h3><h3><div class="separator" style="clear: both; font-size: medium; font-weight: 400;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="color: black; font-size: small;"><div></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="text-align: justify;"><span></span></div></div></div></span></span></div></h3><h3><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span style="font-weight: 400;"></span></span></span></div><div class="separator" style="clear: both; font-weight: 400; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><div class="separator" style="clear: both; font-size: medium;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEh6KyzdsGvhc9PWf57OSmBDARhOmOmIOyI29Zjnixg3fSJ6dIN8UTYPpJBfv4OTW--_gClFtsew3AoaBRJoGVufBIRK8VdKo8OFgE1SxYck4uOA3CC6qj3hqfQMl4K87TrHVKCdKLEunEsf3AJeAzBwAwe7XfL3MBLUR6ET4Vdheogb5qODr1zgMQ" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="788" data-original-width="1519" height="332" src="https://blogger.googleusercontent.com/img/a/AVvXsEh6KyzdsGvhc9PWf57OSmBDARhOmOmIOyI29Zjnixg3fSJ6dIN8UTYPpJBfv4OTW--_gClFtsew3AoaBRJoGVufBIRK8VdKo8OFgE1SxYck4uOA3CC6qj3hqfQMl4K87TrHVKCdKLEunEsf3AJeAzBwAwe7XfL3MBLUR6ET4Vdheogb5qODr1zgMQ=w640-h332" width="640" /></a></div></div></div></div><div class="separator" style="clear: both;"><span style="font-size: x-small;"><span style="color: black;">圖 3:循序搜尋演算法</span></span></div></span></div></h3><h3><div class="separator" style="clear: both;"><span style="color: #222222; font-size: small;"><span style="color: #222222;"><span style="font-weight: 400;">2. </span>09-05.選擇排序法</span><span style="color: black; font-weight: 400;"><span style="color: #222222;">:</span></span></span><span style="font-size: small;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span><span><span style="font-weight: 400;">根據流程圖</span></span></span></span><span><span style="color: #222222; font-weight: 400; text-align: right;"><span><span><span style="color: black;">將 </span></span></span></span></span><span style="color: black; font-weight: 400; text-align: left;">Python 程式</span><span style="color: black; font-weight: 400; text-align: left;">轉換妥後</span><span style="color: black; font-weight: 400;">以「</span><span style="color: black; text-align: center;"><span><span style="font-weight: 400; white-space: pre-wrap;">09-05.選擇排序法.py」存檔執行</span></span></span><span style="color: black; font-weight: 400;">後就能看到</span><span style="color: black; font-weight: 400; text-align: left;">如圖 4</span><span style="color: black; font-weight: 400; text-align: left;"> 所對應的</span><span style="color: black; font-weight: 400;">執行結果。</span></span></div><div class="separator" style="clear: both;"><span style="color: black; font-size: medium; font-weight: 400;"><br /></span></div><div class="separator" style="clear: both;"><span style="color: #222222; font-size: medium; font-weight: 400;"><div class="separator" style="clear: both; text-align: center;"></div></span><div style="text-align: center;"><span style="font-size: x-small; font-weight: 400;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEg4yTIXc90xxwooZ0LUALsASwmUDOrXfqv41qsEV7pZgwIA9LqbA-aWO3rn2eI5gtTM5dYv-KcVgFzAcEttkLFuFR4FZID1R_bMnLluqirXcCvxZ8czcdTC1TBcfv8WNUwUg8gt_6kYh2ttIrIwgTElTAU3N7PbnnsbgdYVKwcvtYH_Zmks-71Ksw" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="792" data-original-width="1749" height="290" src="https://blogger.googleusercontent.com/img/a/AVvXsEg4yTIXc90xxwooZ0LUALsASwmUDOrXfqv41qsEV7pZgwIA9LqbA-aWO3rn2eI5gtTM5dYv-KcVgFzAcEttkLFuFR4FZID1R_bMnLluqirXcCvxZ8czcdTC1TBcfv8WNUwUg8gt_6kYh2ttIrIwgTElTAU3N7PbnnsbgdYVKwcvtYH_Zmks-71Ksw=w640-h290" width="640" /></a></div></div>圖 4:選擇排序演算法,資料以遞增方式排妥</div></span></div></div></h3></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="text-align: justify;"><span><a name='more'></a></span></div></div></div></div></div></span></div></div><div><div style="background-color: white;"><ol><li style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; margin: 0px 0px 0.25em; padding: 0px; text-align: justify;"><span style="font-size: x-small;"><a href="http://creativecommons.tw/explore" style="background-color: transparent; color: #2288bb; font-family: times, "times new roman", serif; text-decoration-line: none;" target="_blank">六種授權條款</a><span face="arial, tahoma, helvetica, freesans, sans-serif" style="background-color: transparent;">。</span></span></li></ol></div></div>Ted Leehttp://www.blogger.com/profile/03077454870590095355noreply@blogger.com0tag:blogger.com,1999:blog-1468347421357730785.post-28809529370304366092022-11-13T23:40:00.034+08:002022-11-16T00:44:17.407+08:00[科技宝, Cagebot, 8787, AI, Arduino] 國廠祥儀科技寶智慧手臂 3/3:電控程式設篇<h1 style="text-align: center;"> <span style="text-align: center;">國廠祥儀科技寶智慧手臂 3/3:</span></h1><h1 style="text-align: center;">電控程式設計篇</h1><div style="background-color: white; text-align: center;"><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><a href="https://www.facebook.com/groups/134149180510967/" style="color: #2288bb; text-decoration-line: none;" target="_blank"><span style="font-family: times, "times new roman", serif;">Ted Lee的土饅頭(To Mentor)工坊</span></a></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><div><span style="font-family: times, "times new roman", serif;">Line:ted2016.kpvs</span><br /><span style="font-family: times, "times new roman", serif;">Email:<a href="mailto:Lct4246@gmail.com" target="_blank">Lct4246@gmail.com</a></span><br /><span style="font-family: times, "times new roman", serif;"><span style="font-family: "times new roman", serif;">FB</span>:<a href="http://gg.gg/TedLeeFB/" target="_blank"><span style="font-family: "times new roman", serif;">http://gg.gg/</span><span style="color: #00cc00; font-family: "times new roman", serif;">TedLee</span><span style="color: red; font-family: "times new roman", serif;">FB</span><span style="font-family: "times new roman", serif;">/</span></a></span></div><div><span lang="" style="font-family: times, "times new roman", serif; font-size: 12pt;">Blog<span style="font-family: "times new roman"; font-size: small;">:</span><a href="http://gg.gg/TedLeeBlog/" target="_blank">http://gg.gg/<span style="color: #00cc00;">TedLee</span><span style="color: red;">Blog</span>/</a></span><br /></div></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><span style="font-family: times, "times new roman", serif;"><br /></span></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><span style="font-family: times, "times new roman", serif;">Nov. 13, 2022</span></div><div><span><span style="color: #222222; font-family: times, "times new roman", serif;"><span style="font-size: 13.2px;"><div class="separator" style="clear: both;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s88/CC.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="31" data-original-width="88" height="31" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s1600/CC.png" width="88" /></a>[1]</div></span></span><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhu6L-Zas0CXls1_NAQ1OO0NOa1vwfo6upApM9HZXfDNC4mUvj7HIRSm7if0GIXW2j3Po4Wpi8vA0Nk7sSD5STLYPEBFxWvG3B6-Tsc9AD8zHkpIM8eQmd1Qm3SJzxpKM4iJrJg0OGKeZyexlzSSLXlrZLV4ogJk6XKH7NLyjzqdRpQCv32n20KZw/s2048/S__47652983.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="1537" data-original-width="2048" height="240" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhu6L-Zas0CXls1_NAQ1OO0NOa1vwfo6upApM9HZXfDNC4mUvj7HIRSm7if0GIXW2j3Po4Wpi8vA0Nk7sSD5STLYPEBFxWvG3B6-Tsc9AD8zHkpIM8eQmd1Qm3SJzxpKM4iJrJg0OGKeZyexlzSSLXlrZLV4ogJk6XKH7NLyjzqdRpQCv32n20KZw/s320/S__47652983.jpg" width="320" /></a> <iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/vV6t-1ZZODE" width="320" youtube-src-id="vV6t-1ZZODE"></iframe> [2][3]</div><div class="separator" style="clear: both; text-align: justify;"><br /></div><div class="separator" style="clear: both; text-align: justify;"><div class="separator" style="clear: both;">本系列第三篇文章延續了第一篇《國廠祥儀科技寶智慧手臂 1/3:機構設計篇(<a href="https://lct4246.blogspot.com/2022/11/cagebot-8787-ai-arduino.html" target="_blank">https://reurl.cc/Wq1aWZ</a>)》的解析,本文將進一步地著墨在<span style="color: red;">控制板(Arduino Nano)</span>、<span style="color: red;">PCA9685 </span>與<span style="color: red;"> 8787 </span>的<span>電控程式</span><span>設計上(</span>圖 1 最右方塊)。</div><div><br /></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9wJUBjfnY34qEGUvKFQbnV-2_b9kkgG9YHThij7pFusrof7dzqOc7AN7gpv7YeEvm7sQ9us2BOYOg4UBIU6XtRBiI5uDEssUBGw8XIIlso1eI6A_gKcm7broQ97ZokLKUCgl9o_zcR9Rvc5j1sOvV0FBhVvuF8a1aELhG50HfZ1n8hCjg5iX7tg/s621/%E6%A9%9F%E9%9B%BB%E6%95%B4%E5%90%88%E5%B0%88%E6%A1%88%E4%B8%89%E5%A4%A7%E8%A8%AD%E8%A8%88.drawio.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="159" data-original-width="621" height="164" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9wJUBjfnY34qEGUvKFQbnV-2_b9kkgG9YHThij7pFusrof7dzqOc7AN7gpv7YeEvm7sQ9us2BOYOg4UBIU6XtRBiI5uDEssUBGw8XIIlso1eI6A_gKcm7broQ97ZokLKUCgl9o_zcR9Rvc5j1sOvV0FBhVvuF8a1aELhG50HfZ1n8hCjg5iX7tg/w640-h164/%E6%A9%9F%E9%9B%BB%E6%95%B4%E5%90%88%E5%B0%88%E6%A1%88%E4%B8%89%E5%A4%A7%E8%A8%AD%E8%A8%88.drawio.png" width="640" /></a></div><div class="separator" style="clear: both; text-align: center;"><span style="font-size: x-small;">圖 1:機電整合專案三大設計</span></div></div></div><div style="text-align: justify;"><div style="text-align: center;"><br /></div><div><div><h2 style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;">完整的電控程式</h2><div>我們先來看看將控制板、PCA9685 與 8787 三者整合後的完整程式(<a href="https://github.com/SilasYoome/cageboard_robot_arm_follow" target="_blank">https://reurl.cc/585AlM</a>)(註:祥儀的 RD 是以 Performio(<a href="https://www.performio.co">https://www.performio.com</a>)這套 IDE 來開發智慧手臂的測試程式的,所以,它的主程式為 main.cpp。我們打開這隻程式細看,setup()、loop() 依舊是 Arduino IDE 的 C/ C++ 語法。因此,只要將智慧手臂的函式庫(<a href="https://github.com/SilasYoome/cageboard_robot_arm_follow/tree/main/lib" target="_blank">https://reurl.cc/58paLz</a>)複製到Arduino IDE 預設的函式庫存放路徑 C:\Program Files (x86)\Arduino\libraries 或 C:\Users\<user>\Documents\Arduino\libraries 之下即可順利編譯之。):</div><div><span style="color: #f1c232;"><br /></span></div><div><span style="color: #f1c232;">黃色指令</span>為用來預測 8787 移動路徑的<b>卡爾曼濾波器(Kalman filter)</b>的程式碼;</div><div><span style="color: #a64d79;">紫色指令</span>為 PCA9685 伺服馬達擴充板的控制程式碼;</div><div><span style="color: #6aa84f;">綠色指令</span>為 威盛 8787 AI 視覺感測器的控制程式碼。</div><div><br /></div></div><div><div>#include <Arduino.h></div><div>#include <Wire.h></div><div>#include <SoftwareSerial.h></div><div><span style="color: #a64d79;">#include "PCA9685.h"</span></div><div><span style="color: #f1c232;">#include "SimpleKalmanFilter.h"</span></div><div><span style="color: #6aa84f;">#include "Pixetto.h"</span></div><div><br /></div><div><span style="color: #a64d79;">#define sevo1_pin 0</span></div><div><span style="color: #a64d79;">#define servo1_angle_min -90</span></div><div><span style="color: #a64d79;">#define servo1_angle_max 90</span></div><div><span style="color: #a64d79;">#define servo1_angle_init 0</span></div><div><span style="color: #a64d79;"><br /></span></div><div><span style="color: #a64d79;">#define sevo2_pin 1</span></div><div><span style="color: #a64d79;">#define servo2_angle_min -90</span></div><div><span style="color: #a64d79;">#define servo2_angle_max 90</span></div><div><span style="color: #a64d79;">#define servo2_angle_init 0</span></div><div><span style="color: #a64d79;"><br /></span></div><div><span style="color: #a64d79;">#define sevo3_pin 2</span></div><div><span style="color: #a64d79;">#define servo3_angle_min -90</span></div><div><span style="color: #a64d79;">#define servo3_angle_max 90</span></div><div><span style="color: #a64d79;">#define servo3_angle_init 0</span></div><div><span style="color: #a64d79;"><br /></span></div><div><span style="color: #a64d79;">#define sevo4_pin 3</span></div><div><span style="color: #a64d79;">#define servo4_angle_min -90</span></div><div><span style="color: #a64d79;">#define servo4_angle_max 90</span></div><div><span style="color: #a64d79;">#define servo4_angle_init 0</span></div><div><br /></div><div><span style="color: #6aa84f;">#define rxPin 11</span></div><div><span style="color: #6aa84f;">#define txPin 9</span></div><div><span style="color: #6aa84f;"><br /></span></div><div><span style="color: #6aa84f;">Pixetto ss(rxPin, txPin);</span></div><div><br /></div><div><span style="color: #a64d79;">PCA9685 driver;</span></div><div><span style="color: #a64d79;">// PCA9685 輸出 = 12 位 = 4096 步</span></div><div><span style="color: #a64d79;">// 20ms 的 2.5% = 0.5ms ; 20ms 的 12.5% = 2.5ms</span></div><div><span style="color: #a64d79;">// 4096 的 2.5% = 102 步;4096 的 12.5% = 512 步</span></div><div><span style="color: #a64d79;">PCA9685_ServoEval pwmServo1; // (0deg, 90deg, 180deg)</span></div><div><span style="color: #a64d79;">PCA9685_ServoEval pwmServo2; // (0deg, 90deg, 180deg)</span></div><div><span style="color: #a64d79;">PCA9685_ServoEval pwmServo3; // (0deg, 90deg, 180deg)</span></div><div><span style="color: #a64d79;">PCA9685_ServoEval pwmServo4; // (0deg, 90deg, 180deg)</span></div><div><br /></div><div><span style="color: #f1c232;">SimpleKalmanFilter KalmanFilter_X(1, 1, 0.01);</span></div><div><span style="color: #f1c232;">SimpleKalmanFilter KalmanFilter_Y(1, 1, 0.01);</span></div><div><br /></div><div>int servo1Pos, servo2Pos, servo3Pos; // 當前角度</div><div><span style="color: #f1c232;">int KalmanX, KalmanY;</span></div><div><br /></div><div>void setup() {</div><div> Wire.begin(); // Wire must be started first</div><div><br /></div><div><span style="color: #a64d79;"> driver.resetDevices(); // Software resets all PCA9685 devices on Wire line</span></div><div><span style="color: #a64d79;"> driver.init(); // Address pins A5-A0 set to B000000</span></div><div><span style="color: #a64d79;"> driver.setPWMFreqServo(); // Set frequency to 50Hz</span></div><div><br /></div><div><span style="color: #a64d79;"> driver.setChannelPWM(0, pwmServo1.pwmForAngle(servo1_angle_init));</span></div><div><span style="color: #a64d79;"> delay(10);</span></div><div><span style="color: #a64d79;"> driver.setChannelPWM(1, pwmServo2.pwmForAngle(servo2_angle_init));</span></div><div><span style="color: #a64d79;"> delay(10);</span></div><div><span style="color: #a64d79;"> driver.setChannelPWM(2, pwmServo3.pwmForAngle(servo3_angle_init));</span></div><div><span style="color: #a64d79;"> delay(10);</span></div><div><span style="color: #a64d79;"> driver.setChannelPWM(3, pwmServo4.pwmForAngle(servo4_angle_init));</span></div><div><span style="color: #a64d79;"> delay(10);</span></div><div><br /></div><div><span style="color: #6aa84f;"> ss.begin();</span></div><div><span style="color: #6aa84f;"> ss.enableFunc(Pixetto::FUNC_COLOR_DETECTION);</span></div><div><span style="color: #6aa84f;"> delay(10);</span></div><div><span style="color: #6aa84f;"> Serial.begin(9600);</span></div><div> </div><div> servo1Pos = servo1_angle_init+90;</div><div> servo2Pos = servo2_angle_init+90;</div><div> servo3Pos = servo3_angle_init+90;</div><div>}</div><div><br /></div><div>void loop() {</div><div><span style="color: #6aa84f;"> if (ss.isDetected()) {</span></div><div> Serial.print("x:");</div><div> Serial.println(ss.getPosX());</div><div> Serial.print("y:");</div><div> Serial.println(ss.getPosY());</div><div> Serial.print("w:");</div><div> Serial.println(ss.getWidth());</div><div> Serial.println("");</div><div><span style="color: #f1c232;"> KalmanX = KalmanFilter_X.updateEstimate(ss.getPosX());</span></div><div><span style="color: #f1c232;"> KalmanY = KalmanFilter_Y.updateEstimate(ss.getPosY());</span></div><div><span style="color: #6aa84f;"> if (ss.getFuncID() == Pixetto::FUNC_COLOR_DETECTION) {</span></div><div><span style="color: #6aa84f;"> if (ss.getTypeID() == Pixetto::COLOR_RED) {</span></div><div> <span style="color: #f1c232;"> if (KalmanX >= 50) {</span></div><div> servo1Pos -= 5;</div><div> if (servo1Pos >= servo1_angle_max+90)</div><div> servo1Pos = 180;</div><div> <span style="color: #a64d79;">driver.setChannelPWM(0, pwmServo1.pwmForAngle(servo1Pos-90));</span></div><div> }</div><div><span style="color: #f1c232;"> else if (KalmanX <= 25) {</span></div><div> servo1Pos += 5;</div><div> if (servo1Pos <= servo1_angle_min+90)</div><div> servo1Pos = 0;</div><div> <span style="color: #a64d79;">driver.setChannelPWM(0, pwmServo1.pwmForAngle(servo1Pos-90));</span></div><div> }</div><div><span style="color: #f1c232;"> else if (KalmanY <= 17) {</span></div><div> servo2Pos += 5;</div><div> if (servo2Pos >= servo2_angle_max+70)</div><div> servo2Pos = 160;</div><div> <span style="color: #a64d79;">driver.setChannelPWM(1, pwmServo2.pwmForAngle(servo2Pos-90));</span></div><div><br /></div><div> }</div><div><span style="color: #f1c232;"> else if (KalmanY >= 60) {</span></div><div> servo2Pos -= 5;</div><div> if (servo2Pos <= servo2_angle_min+90)</div><div> servo2Pos = 0;</div><div> <span style="color: #a64d79;"> driver.setChannelPWM(1, pwmServo2.pwmForAngle(servo2Pos-90));</span></div><div> }</div><div><br /></div><div> if (servo2Pos <= 65) {</div><div> servo3Pos = servo2Pos + 25;</div><div> if (servo3Pos <= servo3_angle_min+90)</div><div> servo3Pos = 0;</div><div> <span style="color: #a64d79;">driver.setChannelPWM(2, pwmServo3.pwmForAngle(servo3Pos-90));</span></div><div> }</div><div> else if (servo2Pos >= 85) {</div><div> servo3Pos = servo2Pos + 10;</div><div> if (servo3Pos >= servo3_angle_max+90)</div><div> servo3Pos = 180;</div><div> <span style="color: #a64d79;"> driver.setChannelPWM(2, pwmServo3.pwmForAngle(servo3Pos-90));</span></div><div> }</div><div> else {</div><div> servo3Pos = servo3_angle_init;</div><div> <span style="color: #a64d79;"> driver.setChannelPWM(2, pwmServo3.pwmForAngle(servo3Pos));</span></div><div> }</div><div><br /></div><div> }</div><div> }</div><div> }</div><div>}</div></div><div style="text-align: left;"><br /></div><div>如圖 2 所示,電控程式是用來控制硬體運作的指令集合,因此,我們先要想像智慧手臂要如何動作,然後將之對應到伺服馬達群的一連串控制<b>劇本(script)</b>。例如,我們想要讓智慧手臂追蹤到紅球就伸爪去夾住它,將這段劇本翻譯成伺服馬達控制語言則變成:左右轉動伺服馬達 1 去追紅球,水平定位到之後再移動伺服馬達 3 重直定位到紅球蹤跡。接著,調整伺服馬達 2 調整紅球和 8787 遠近的<b>深度(depth)</b>。三軸鎖定紅球的位置後即可張爪夾球。</div><div><br /></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwnJ1ksQpdJ1henzZMQfbcPnsrZrGE1sU8totb_BNxFOxHxck904-96qvIpZfDXEviK66e5rpKOuUtQqnQTO2V2-5qfSCpa_Qm7mD0let8ggnMTL_yeMPwPxKlf52iqYIyqp1cO44uvAJ_82eVHLbuShpgbl8JP1qxsPt3bLAuhzsqdJkQ4mt_wg/s1476/%E9%9B%BB%E6%8E%A7.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="378" data-original-width="1476" height="164" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwnJ1ksQpdJ1henzZMQfbcPnsrZrGE1sU8totb_BNxFOxHxck904-96qvIpZfDXEviK66e5rpKOuUtQqnQTO2V2-5qfSCpa_Qm7mD0let8ggnMTL_yeMPwPxKlf52iqYIyqp1cO44uvAJ_82eVHLbuShpgbl8JP1qxsPt3bLAuhzsqdJkQ4mt_wg/w640-h164/%E9%9B%BB%E6%8E%A7.jpg" width="640" /></a></div><div class="separator" style="clear: both;"><span style="font-size: x-small;">圖 2:電控程式學習拆解</span></div></div><div style="text-align: center;"><br /></div><div style="text-align: justify;"><span style="text-align: left;">圖 2 中最右邊的淺藍色方塊表示現今流行的伺服馬達控制程式界面概可分為積木程式、C/ C++ 和 MicroPython 的語法程式。</span></div><div style="text-align: left;">關於智慧手臂如何自動追蹤紅球,在 Notepad++ 文字編輯器中,我們將上述的程式碼打開,就能很清楚的看到圖 2 中紅框內所框選的即為實作的程式碼,它判斷的數據如圖 3 上半部圖示。此外,在追蹤移動時,為了讓 8787 永遠保持置中,圖 2 中的綠框處即為實作的程式碼,它的判斷數據如圖 3 的最下方圖示。</div><div style="text-align: left;"><br /></div><div style="text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEijgDkpjHvroHHk1yjTCnkGLDcfEIn4vN7SXVLgNp2NYoP9MDs29xLmTG7-JgGEBQv1iotCyYHm_bSlRt3gKrnk8Wd6r2GMIzRAMgRTT8e6B9cquci0VETGsa0j4hR5YEBJmyWikskiV84HFNtM6kilYDjNoiKg-ysjNKm3-oDTXCnlDuc0Ywus6Q" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="925" data-original-width="812" height="640" src="https://blogger.googleusercontent.com/img/a/AVvXsEijgDkpjHvroHHk1yjTCnkGLDcfEIn4vN7SXVLgNp2NYoP9MDs29xLmTG7-JgGEBQv1iotCyYHm_bSlRt3gKrnk8Wd6r2GMIzRAMgRTT8e6B9cquci0VETGsa0j4hR5YEBJmyWikskiV84HFNtM6kilYDjNoiKg-ysjNKm3-oDTXCnlDuc0Ywus6Q=w563-h640" width="563" /></a></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: justify;"><div class="separator" style="clear: both; text-align: center;"><span style="font-size: x-small;">圖 2:自動追蹤的程式片斷</span></div></div></div><div style="text-align: justify;"><div style="text-align: center;"><br /></div></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEhRjcaN4ifd4QYxaLFLXmSWmC4_jZbW6uVKXjcJLXSIYKneFY9J41xMPKrSTw0ts2OQFkMHL0c6r-UFGd9kpC6QRfNb07IKGFyvuNL32cAI8WzweC4eMLLJyO1jdsBlkGzlxa7p3wzedpmDLnzk0mekOA5orU5uwSAEYfTyUvzY91KH-7WJZ6FXcA" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="329" data-original-width="1391" height="152" src="https://blogger.googleusercontent.com/img/a/AVvXsEhRjcaN4ifd4QYxaLFLXmSWmC4_jZbW6uVKXjcJLXSIYKneFY9J41xMPKrSTw0ts2OQFkMHL0c6r-UFGd9kpC6QRfNb07IKGFyvuNL32cAI8WzweC4eMLLJyO1jdsBlkGzlxa7p3wzedpmDLnzk0mekOA5orU5uwSAEYfTyUvzY91KH-7WJZ6FXcA=w640-h152" width="640" /></a></div><span style="font-size: small;">圖 3:自動追蹤紅球時 8787 的移動位置調整</span><br /></div><div style="text-align: justify;"><span style="text-align: left;"><br /></span></div><div style="text-align: center;"><h2 style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;">電控程式之主控板及開發環境建置</h2><div style="text-align: justify;"><span style="text-align: left;">智慧手臂的控制板是 Arduino Nano 的相容板,裝妥 CH340 驅動程式、從裝置管理員確認它被指派到的 COM 埠編號後,我們就可以使用 Arduino IDE (我們使用 V1.8.9(<a href="https://www.google.com/url?q=https%3A%2F%2Fdownloads.arduino.cc%2Farduino-1.8.9-windows.exe%3F_gl%3D1*1rpl2lr*_ga*MjAxMzc5MDAwOS4xNjY2OTY2Mzc3*_ga_NEXN8H46L5*MTY2NzA0NTgwNS4yLjEuMTY2NzA0NTg2Ny4wLjAuMA..&sa=D&sntz=1&usg=AOvVaw3Qo4kYi-c5QutR7fqNUNxs" target="_blank">https://reurl.cc/06Xq3Y</a>)版本,祥儀 RD 建議以 V1.8.X 版為佳──經我們測試,最新的 V2.0.x 版改幅度不小,不建議讀者們採用)來開啟祥儀研發的範例程式。其中,Board 設定為 Arduino Nano、Processor 設定為 ATmega32p (Old Bootloader)、Port 設定為裝置管理員中列出 CH34 的 COM 埠編號。</span></div><div style="text-align: justify;"><span style="text-align: left;">萬事皆備,我們就可以將 Arduino 界最著名的 Blink 範例程式(讓板載在 D13 腳位上的 SMD LED 閃爍)上傳到控制板來測試我們的開發環境是否全然準備妥當,如圖 4 所示。我們將 Blink 的程式碼摘列如下:<br /><br /><div>void setup() {</div><div> // initialize digital pin LED_BUILTIN as an output.</div><div> pinMode(LED_BUILTIN, OUTPUT);</div><div>}</div><div><br /></div><div>void loop() {</div><div> digitalWrite(LED_BUILTIN, HIGH); // turn the LED on (HIGH is the voltage level)</div><div> delay(1000); // wait for a second</div><div> digitalWrite(LED_BUILTIN, LOW); // turn the LED off by making the voltage LOW</div><div> delay(1000); // wait for a second</div><div>}</div><br /><div style="text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEiI1cXDMkfyW3tM8jWjVpJQ6l92qp-POfJJCbgF_WZk8-bm3SUpXuU0tSTlAtNr5UU7emUEkSIJUqQzxxEDr9Ltnx2w7memQA5p06T0Jmt2cGZ4EqE1nSJYXf5fzlvwmVSCs2sZxGF88VzrMUF0LIbcPU1OCtH0kAKU2Pkb_hk7CeeddcvVHp_ZqA" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="343" data-original-width="691" height="318" src="https://blogger.googleusercontent.com/img/a/AVvXsEiI1cXDMkfyW3tM8jWjVpJQ6l92qp-POfJJCbgF_WZk8-bm3SUpXuU0tSTlAtNr5UU7emUEkSIJUqQzxxEDr9Ltnx2w7memQA5p06T0Jmt2cGZ4EqE1nSJYXf5fzlvwmVSCs2sZxGF88VzrMUF0LIbcPU1OCtH0kAKU2Pkb_hk7CeeddcvVHp_ZqA=w640-h318" width="640" /></a></div><span style="font-size: x-small;"><span>圖 4:控制板在 Arduino IDE V.1.8.9 的設定</span><br /></span></div></span></div><div style="text-align: justify;"><br /></div></div><div><span style="text-align: left;"><h2 style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif;">電控程式之 PCA9685</h2><div style="text-align: justify;"><span style="text-align: left;">為了能準確的控制每一顆伺服馬達,我們應該要先弄清楚一顆伺服馬達是如何以指令程式達成控制的。</span><span style="text-align: left;">從 Github 上</span><span style="text-align: left;">取得 PCA9685 的控制程式碼 </span><span style="text-align: left;">pwmtest.ino </span><span style="text-align: left;">後</span><span style="text-align: left;">(</span><a href="https://github.com/adafruit/Adafruit-PWM-Servo-Driver-Library/tree/master/examples/pwmtest" style="text-align: left;" target="_blank">https://reurl.cc/06XNMo</a><span style="text-align: left;">)</span><span style="text-align: left;">,我們將之調整成「單顆」伺服馬達的測試程式如下:</span></div><div style="text-align: justify;"><span style="text-align: left;"><br /></span></div><div style="text-align: justify;"><span style="text-align: left;"><div style="text-align: left;">#include <Wire.h></div><div style="text-align: left;">#include <Adafruit_PWMServoDriver.h></div><div style="text-align: left;"><br /></div><div style="text-align: left;">Adafruit_PWMServoDriver pwm = Adafruit_PWMServoDriver();</div><div style="text-align: left;"><br /></div><div style="text-align: left;">#define SERVOMIN 150</div><div style="text-align: left;">#define SERVOMAX 600</div><div style="text-align: left;">#define USMIN 600</div><div style="text-align: left;">#define USMAX 2400</div><div style="text-align: left;">#define SERVO_FREQ 50</div><div style="text-align: left;"><br /></div><div style="text-align: left;">uint8_t servonum = 0;</div><div style="text-align: left;"><br /></div><div style="text-align: left;">void setup() {</div><div style="text-align: left;"> Serial.begin(9600);</div><div style="text-align: left;"> Serial.println("8 channel Servo test!");</div><div style="text-align: left;"><br /></div><div style="text-align: left;"> pwm.begin();</div><div style="text-align: left;"> </div><div style="text-align: left;"> pwm.setOscillatorFrequency(27000000);</div><div style="text-align: left;"> pwm.setPWMFreq(SERVO_FREQ);</div><div style="text-align: left;"><br /></div><div style="text-align: left;"> delay(10);</div><div style="text-align: left;">}</div><div style="text-align: left;"><br /></div><div style="text-align: left;">void setServoPulse(uint8_t n, double pulse) {</div><div style="text-align: left;"> double pulselength;</div><div style="text-align: left;"> </div><div style="text-align: left;"> pulselength = 1000000;</div><div style="text-align: left;"> pulselength /= SERVO_FREQ;</div><div style="text-align: left;"> Serial.print(pulselength); Serial.println(" us per period"); </div><div style="text-align: left;"> pulselength /= 4096;</div><div style="text-align: left;"> Serial.print(pulselength); Serial.println(" us per bit"); </div><div style="text-align: left;"> pulse *= 1000000;</div><div style="text-align: left;"> pulse /= pulselength;</div><div style="text-align: left;"> Serial.println(pulse);</div><div style="text-align: left;"> pwm.setPWM(n, 0, pulse);</div><div style="text-align: left;">}</div><div style="text-align: left;"><br /></div><div style="text-align: left;">void loop() {</div><div style="text-align: left;"> Serial.println(servonum);</div><div style="text-align: left;"> for (uint16_t pulselen = SERVOMIN; pulselen < SERVOMAX; pulselen++) {</div><div style="text-align: left;"> pwm.setPWM(servonum, 0, pulselen);</div><div style="text-align: left;"> }</div><div style="text-align: left;"><br /></div><div style="text-align: left;"> delay(500);</div><div style="text-align: left;"> for (uint16_t pulselen = SERVOMAX; pulselen > SERVOMIN; pulselen--) {</div><div style="text-align: left;"> pwm.setPWM(servonum, 0, pulselen);</div><div style="text-align: left;"> }</div><div style="text-align: left;"><br /></div><div style="text-align: left;"> delay(500);</div><div style="text-align: left;"><br /></div><div style="text-align: left;"> for (uint16_t microsec = USMIN; microsec < USMAX; microsec++) {</div><div style="text-align: left;"> pwm.writeMicroseconds(servonum, microsec);</div><div style="text-align: left;"> }</div><div style="text-align: left;"><br /></div><div style="text-align: left;"> delay(500);</div><div style="text-align: left;"> for (uint16_t microsec = USMAX; microsec > USMIN; microsec--) {</div><div style="text-align: left;"> pwm.writeMicroseconds(servonum, microsec);</div><div style="text-align: left;"> }</div><div style="text-align: left;"><br /></div><div style="text-align: left;"> delay(500);</div><div style="text-align: left;"><br /></div><div style="text-align: left;"> if (servonum > 7) servonum = 0; // Testing the first 8 servo channels</div><div style="text-align: left;">}</div><div style="text-align: left;"><br /></div><div style="text-align: left;">現在,我們已經學會了單顆伺服馬達了,接下來就可以輕鬆地把像圖 2 提及的智慧手臂動作劇本轉換成對應的四顆伺服馬達控制指令了,讀者們可以自行挑戰看看!</div><div style="text-align: left;"><br /></div><div style="text-align: left;">此外,卡爾曼濾波器的測試程式可從此 <a href="https://github.com/SilasYoome/cageboard_robot_arm_follow/blob/main/lib/SimpleKalmanFilter/examples/BasicKalmanFilterExample/BasicKalmanFilterExample.ino" target="_blank">https://reurl.cc/X5V05M</a> 下載測試並從中了解這個數學模型的使用方式。</div><div style="text-align: left;"><br /></div></span></div></span></div><div></div></div><div><h2 style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;">電控程式之 8787</h2><div>首先,在 Pixtto 公用程式(Pixetto Utility)中設定使用 8787 內建的<b>顏色偵測(color detection)</b> AI 模型,如圖 5 所示。</div><div><br /></div><div style="text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEiWwOCYEPwrCG0YhjtVfbaXJAVv9pZy5_SPQPUOAUqSGXJ7bcRi6qUyjBR1IwWlt4vKdgLnObAxFPi_TrlTT-ZaqKnjrrhAkCryZi9hxS0TypLagIlocCF6PvZ34Gx4uLqLAq1DydapSybHf2guTirdEw3u3bZLQFu0ic1BV-LA1ff1l3LvW9Z-xQ" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="964" data-original-width="1523" height="406" src="https://blogger.googleusercontent.com/img/a/AVvXsEiWwOCYEPwrCG0YhjtVfbaXJAVv9pZy5_SPQPUOAUqSGXJ7bcRi6qUyjBR1IwWlt4vKdgLnObAxFPi_TrlTT-ZaqKnjrrhAkCryZi9hxS0TypLagIlocCF6PvZ34Gx4uLqLAq1DydapSybHf2guTirdEw3u3bZLQFu0ic1BV-LA1ff1l3LvW9Z-xQ=w640-h406" width="640" /></a></div><span style="font-size: x-small;">圖 5:在 Pixetto 公用程式中指定顏色偵測的內建 AI 功能</span><br /><br /></div><div>緊接著,因為智慧手臂的 Github(<a href="https://github.com/SilasYoome/cageboard_robot_arm_follow/tree/main/lib" target="_blank">https://reurl.cc/58paLz</a>)中已含有 8787 V1.5.1 版的 Arduino 函式庫,所以,在 Arduino IDE 中可以使用下列的語法架構如來設計:</div></div><div><br /></div><div><div>if (ss.isDetected()) {</div><div> if (ss.getFuncID() == Pixetto::FUNC_COLOR_DETECTION) {</div><div> if (ss.getTypeID() == Pixetto::COLOR_RED) {</div><div><span style="white-space: pre;"> </span> //...</div><div><span style="white-space: pre;"> </span> }</div><div><span style="white-space: pre;"> </span>}</div><div>}</div></div><div><br /></div><div>關於 8787 內建的 AI 模型詳列如下,有興趣的讀者們可詳參 <a href="https://github.com/SilasYoome/cageboard_robot_arm_follow/blob/main/lib/Pixetto/src/Pixetto.h" target="_blank">https://reurl.cc/qZN7Mp</a> 這隻 C 語言的標頭檔(header file):</div><div><br /></div><div><div>enum EFunc</div><div><span style="white-space: pre;"> </span>{</div><div><span style="white-space: pre;"> </span><span style="color: red;">FUNC_COLOR_DETECTION<span style="white-space: pre;"> </span>= 1,</span></div><div><span style="white-space: pre;"> </span>FUNC_COLOR_CODE_DETECTION<span style="white-space: pre;"> </span>= 2,</div><div><span style="white-space: pre;"> </span>FUNC_SHAPE_DETECTION<span style="white-space: pre;"> </span>= 3,</div><div><span style="white-space: pre;"> </span>FUNC_SPHERE_DETECTION<span style="white-space: pre;"> </span>= 4,</div><div><span style="white-space: pre;"> </span>FUNC_TEMPLATE_MATCHING<span style="white-space: pre;"> </span>= 6,</div><div><span style="white-space: pre;"> </span>FUNC_KEYPOINTS<span style="white-space: pre;"> </span>= 8,</div><div><span style="white-space: pre;"> </span>FUNC_NEURAL_NETWORK<span style="white-space: pre;"> </span>= 9,</div><div><span style="white-space: pre;"> </span>FUNC_APRILTAG<span style="white-space: pre;"> </span>= 10,</div><div><span style="white-space: pre;"> </span>FUNC_FACE_DETECTION<span style="white-space: pre;"> </span>= 11,</div><div><span style="white-space: pre;"> </span>FUNC_TRAFFIC_SIGN_DETECTION<span style="white-space: pre;"> </span>= 12,</div><div><span style="white-space: pre;"> </span>FUNC_HANDWRITTEN_DIGITS_DETECTION<span style="white-space: pre;"> </span>= 13,</div><div><span style="white-space: pre;"> </span>FUNC_HANDWRITTEN_LETTERS_DETECTION<span style="white-space: pre;"> </span>= 14,</div><div><span style="white-space: pre;"> </span>FUNC_CLOUD_DETECTION<span style="white-space: pre;"> </span>= 15,</div><div><span style="white-space: pre;"> </span>FUNC_LANES_DETECTION<span style="white-space: pre;"> </span>= 16,</div><div><span style="white-space: pre;"> </span>FUNC_EQUATION_DETECTION<span style="white-space: pre;"> </span>= 17,</div><div><span style="white-space: pre;"> </span>FUNC_SIMPLE_CLASSIFIER<span style="white-space: pre;"> </span>= 18,</div><div><span style="white-space: pre;"> </span>FUNC_VOICE_COMMAND<span style="white-space: pre;"> </span>= 19</div><div><span style="white-space: pre;"> </span>};</div></div><div><span><a name='more'></a></span></div></div></span></div></div><div><div style="background-color: white;"><ol style="text-align: left;"><li style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; margin: 0px 0px 0.25em; padding: 0px; text-align: justify;"><span style="font-size: x-small;"><a href="http://creativecommons.tw/explore" style="background-color: transparent; color: #2288bb; font-family: times, "times new roman", serif; text-decoration-line: none;" target="_blank">六種授權條款</a><span face="arial, tahoma, helvetica, freesans, sans-serif" style="background-color: transparent;">。</span></span></li><li style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; margin: 0px 0px 0.25em; padding: 0px; text-align: justify;"><span style="font-size: x-small;">感謝祥儀提供智慧手臂第一手相關文件。</span></li><li style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; margin: 0px 0px 0.25em; padding: 0px; text-align: justify;"><span style="font-size: x-small;">感謝羅傑史丹兒童程式教育學院(<a href="https://www.facebook.com/RogerStanCoding" target="_blank">https://reurl.cc/nZOyRD</a>)提供智慧手臂借測與學生體驗。</span></li></ol><div style="text-align: justify;"></div></div></div>Ted Leehttp://www.blogger.com/profile/03077454870590095355noreply@blogger.com0tag:blogger.com,1999:blog-1468347421357730785.post-27655091264640177472022-11-13T07:06:00.078+08:002022-11-20T18:56:21.388+08:00[科技宝, Cagebot, 8787, AI, Arduino] 國廠祥儀科技寶智慧手臂 2/3:機電整合設計篇<h1 style="text-align: center;"> <span style="text-align: center;">國廠祥儀科技寶智慧手臂 2/3:</span></h1><h1 style="text-align: center;">機電整合設計篇</h1><div style="background-color: white; text-align: center;"><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><a href="https://www.facebook.com/groups/134149180510967/" style="color: #2288bb; text-decoration-line: none;" target="_blank"><span style="font-family: times, "times new roman", serif;">Ted Lee的土饅頭(To Mentor)工坊</span></a></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><div><span style="font-family: times, "times new roman", serif;">Line:ted2016.kpvs</span><br /><span style="font-family: times, "times new roman", serif;">Email:<a href="mailto:Lct4246@gmail.com" target="_blank">Lct4246@gmail.com</a></span><br /><span style="font-family: times, "times new roman", serif;"><span style="font-family: "times new roman", serif;">FB</span>:<a href="http://gg.gg/TedLeeFB/" target="_blank"><span style="font-family: "times new roman", serif;">http://gg.gg/</span><span style="color: #00cc00; font-family: "times new roman", serif;">TedLee</span><span style="color: red; font-family: "times new roman", serif;">FB</span><span style="font-family: "times new roman", serif;">/</span></a></span></div><div><span lang="" style="font-family: times, "times new roman", serif; font-size: 12pt;">Blog<span style="font-family: "times new roman"; font-size: small;">:</span><a href="http://gg.gg/TedLeeBlog/" target="_blank">http://gg.gg/<span style="color: #00cc00;">TedLee</span><span style="color: red;">Blog</span>/</a></span><br /></div></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><span style="font-family: times, "times new roman", serif;"><br /></span></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><span style="font-family: times, "times new roman", serif;">Nov. 13, 2022</span></div><div><span><span style="color: #222222; font-family: times, "times new roman", serif;"><span style="font-size: 13.2px;"><div class="separator" style="clear: both;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s88/CC.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="31" data-original-width="88" height="31" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s1600/CC.png" width="88" /></a>[1]</div></span></span><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSzXMIO0pzTDfncJyXzE3AczIvMLqDUpkww7AaaNVb40O4Xzz5eG2GnJMDlH6D2me2b1TKOw61I2RHhEEQGw3MrgI9lObJ1e5ZXxPxVTpjCK9vk1DbGx_e-ReQOpDOEC8TJthjYuQ5BSgcbSRwFdT9ZfrSkIamQtJxaH-5J3VG9Fz2_atBEit7Ag/s1443/LINE_ALBUM_20221106%E4%BA%94%E6%A0%A1%E6%88%90%E6%9E%9C%E7%99%BC%E8%A1%A8%E6%9C%83_221106_0.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="764" data-original-width="1443" height="211" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSzXMIO0pzTDfncJyXzE3AczIvMLqDUpkww7AaaNVb40O4Xzz5eG2GnJMDlH6D2me2b1TKOw61I2RHhEEQGw3MrgI9lObJ1e5ZXxPxVTpjCK9vk1DbGx_e-ReQOpDOEC8TJthjYuQ5BSgcbSRwFdT9ZfrSkIamQtJxaH-5J3VG9Fz2_atBEit7Ag/w400-h211/LINE_ALBUM_20221106%E4%BA%94%E6%A0%A1%E6%88%90%E6%9E%9C%E7%99%BC%E8%A1%A8%E6%9C%83_221106_0.jpg" width="400" /></a></div><div class="separator" style="clear: both; text-align: center;"><br /></div><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/C9oSw6tii2s" width="320" youtube-src-id="C9oSw6tii2s"></iframe> [2][3]</div><div class="separator" style="clear: both; text-align: justify;"><br /></div><div class="separator" style="clear: both; text-align: justify;"><div class="separator" style="clear: both;">本系列第二篇文章延續了前一篇《國廠祥儀科技寶智慧手臂 1/3:機構設計篇(<a href="https://lct4246.blogspot.com/2022/11/cagebot-8787-ai-arduino.html" target="_blank">https://reurl.cc/Wq1aWZ</a>)》的解析,本文將進一步地著墨在<span>機電整合</span><span>設計上(</span>圖 1 中間方塊),仔細地剖析<span style="color: red;">控制板(Arduino Nano)</span>、<span style="color: red;">伺服馬達</span>與<span style="color: red;"> 16 路伺馬達擴充板 PCA9685 </span>的電路設計。這三者的接線圖如圖 3,電路圖如圖 4 所示。註:智慧手臂的控制板在出廠的接線已改為以 D11(8787 Grove 的黃線接做為接收 Rx 的控制板接腳) 和 D9(8787 Grove 的白線接做為傳送 Tx 的控制板接腳) 和 8787 做四線對接<b>交握(handshaking)</b>通信,請讀者自行調整圖 2 和圖 3 的接腳接線。 </div><div><br /></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9wJUBjfnY34qEGUvKFQbnV-2_b9kkgG9YHThij7pFusrof7dzqOc7AN7gpv7YeEvm7sQ9us2BOYOg4UBIU6XtRBiI5uDEssUBGw8XIIlso1eI6A_gKcm7broQ97ZokLKUCgl9o_zcR9Rvc5j1sOvV0FBhVvuF8a1aELhG50HfZ1n8hCjg5iX7tg/s621/%E6%A9%9F%E9%9B%BB%E6%95%B4%E5%90%88%E5%B0%88%E6%A1%88%E4%B8%89%E5%A4%A7%E8%A8%AD%E8%A8%88.drawio.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="159" data-original-width="621" height="164" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9wJUBjfnY34qEGUvKFQbnV-2_b9kkgG9YHThij7pFusrof7dzqOc7AN7gpv7YeEvm7sQ9us2BOYOg4UBIU6XtRBiI5uDEssUBGw8XIIlso1eI6A_gKcm7broQ97ZokLKUCgl9o_zcR9Rvc5j1sOvV0FBhVvuF8a1aELhG50HfZ1n8hCjg5iX7tg/w640-h164/%E6%A9%9F%E9%9B%BB%E6%95%B4%E5%90%88%E5%B0%88%E6%A1%88%E4%B8%89%E5%A4%A7%E8%A8%AD%E8%A8%88.drawio.png" width="640" /></a></div><div class="separator" style="clear: both; text-align: center;"><span style="font-size: x-small;">圖 1:機電整合專案三大設計</span></div><div style="text-align: center;"><br /></div></div></div><div style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjZnO_RI_s8A2JntS8MpDQQgMzHzKid7KY92Y4zRPjq6tEDsDhqKmMRQvfarbu_FBnwZqMH7LERCnULvZzVcoQ7r2CywWJdiOjZRGT2cxUAB8BzPNCDX2ph69CQYve1TeZKj5nUkIF2-xQPVGBkgHcMff_6fuJm_XPugEncDW0s7aiHYnUWyKoY8A" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="529" data-original-width="1280" height="264" src="https://blogger.googleusercontent.com/img/a/AVvXsEjZnO_RI_s8A2JntS8MpDQQgMzHzKid7KY92Y4zRPjq6tEDsDhqKmMRQvfarbu_FBnwZqMH7LERCnULvZzVcoQ7r2CywWJdiOjZRGT2cxUAB8BzPNCDX2ph69CQYve1TeZKj5nUkIF2-xQPVGBkgHcMff_6fuJm_XPugEncDW0s7aiHYnUWyKoY8A=w640-h264" width="640" /></a></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><span style="font-size: small;">圖 2:智慧手臂接線圖</span></div></div></div></div><div style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;"><br /></div><div style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;"><div class="separator" style="clear: both; color: black; font-family: "Times New Roman"; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEiL6aOiL9hXnn9ZAO9s4x5RHPJmjKwuQ8xk6T4iBfCFs0FOhVVPGlNjFHJ5JmMeC27voWnE_nGhPTQQIdkp5jx4Q8V1mvogdEghGdUSpdIFK6FMndZwHT9VjKg5b-Or4-qdUz754naDgwQoc7HExFwszLGpI0dyNJXQOzzwUo7KfLlIzmKDdm9tDw" style="font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="742" data-original-width="742" height="640" src="https://blogger.googleusercontent.com/img/a/AVvXsEiL6aOiL9hXnn9ZAO9s4x5RHPJmjKwuQ8xk6T4iBfCFs0FOhVVPGlNjFHJ5JmMeC27voWnE_nGhPTQQIdkp5jx4Q8V1mvogdEghGdUSpdIFK6FMndZwHT9VjKg5b-Or4-qdUz754naDgwQoc7HExFwszLGpI0dyNJXQOzzwUo7KfLlIzmKDdm9tDw=w640-h640" width="640" /></a></div><div style="color: black; font-family: "Times New Roman"; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; font-size: x-small;">圖 3:</span><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; font-size: small;">智慧手臂</span><span style="color: #222222; font-size: small;">電路圖</span></div></div><div style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;"><br /></div><div style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;">另一方面,因為伺服馬達與 8787 都是吃大電流的電子元件,以「多電源共地」方式拉電源是比較安穩的供電方式(圖 2 是以二顆 18650 的 7.4 V 電池並聯供電) [4]:</div><div style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;"><br /></div><div style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;">電源供應 1:供應 5V 給 PCA 9685 去控四顆伺服馬達</div><div style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;">電源供應 2:供應 5V 給 8787</div><div style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;">電源供應 3:供應 5V 給控制板 </div><div style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;"><br /></div><h2 style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;">機電整合之 Arduino Nano</h2><h2 style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;"><div style="clear: both; font-size: medium; font-weight: 400; text-align: justify;">智慧手臂使用祥儀自家設計的<b>科技寶(Cagebot)</b>控制板(<a href="https://www.cagebot.com/website/product_detailed/66/224">https://reurl.cc/X5jn1a</a>),這是一塊 Arduino Nano 的相容板子,使用前要先掛上 CH340 驅動程式(<a href="https://www.google.com/url?q=https%3A%2F%2Fcdn.sparkfun.com%2Fassets%2Flearn_tutorials%2F8%2F4%2F4%2FCH341SER.EXE&sa=D&sntz=1&usg=AOvVaw3jndexbTaiPqP4qTUzhbzr">https://reurl.cc/VRDVK6</a>)。然後在<b>裝置管理員(device manager)</b>(以 Windows 為例,其他作業系統請自行尋找)中可查看到作業系統所指派的<b>序列埠(COM port)</b>編號──此號碼很重要,一定要學會隨時查看,因為我們隨後會以 Arduino IDE 開發工具透過此通道將程式上傳到控制板中。</div></h2><div><div class="separator" style="clear: both; text-align: justify;"><h2 style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;">機電整合之伺服馬達</h2><div>伺服馬達採用了<b>閉迴路(closed-loop)</b>的<b>迴授(feedback)</b>機制(<a href="https://www.gushiciku.cn/dl/1z8YM/zh-tw" target="_blank">https://reurl.cc/aaV0vZ</a>),使之能以 0~180 度控制其轉動角度。至於馬達內的各<b>部件(parts)</b>,強烈建議讀者以破壞式學習(<a href="https://www.bilibili.com/video/BV1dX4y1N7CC/" target="_blank">https://reurl.cc/aaV0vZ</a>),透過逐一拆解的過程去印證這些組成部件的關連性,以建立知識的<b>直覺(intutition)</b>。</div><div><br /></div></div><h2 style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;">機電整合之 PCA9685</h2><div style="text-align: justify;">(伺服)馬逹是以電生磁,磁生力的電磁作用轉動的,它在啟動瞬間需要較大的啟動電流去推動,因此,切勿貪圖一時方便直接將之接到控制板的<b> GPIO(General Purpose Input/ Output)接腳(pin)</b>上。雖然偶一為之看不出它對控制板的傷害,但隨著多次的積累使用,其實是在加速控制板的<b>老化(burnout)</b>,就好像一直往存款有限的戶頭大量提款,這筆存款就會很「快」地被提領殆盡的。因此,我們選擇了 16 路四線 I2C 匯流排(bus)介面的馬達擴充板 PCA9685(<a href="https://www.nxp.com/products/power-management/lighting-driver-and-controller-ics/led-controllers/16-channel-12-bit-pwm-fm-plus-ic-bus-led-controller:PCA9685" target="_blank">https://reurl.cc/58pVn7</a>)來趨動智慧手臂的四軸。</div></div><div><br /></div><div style="text-align: justify;"><h2 style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;">機電整合之 8787</h2><div>8787 以 Grove 四線(Tx 黃、Rx 白、+5V 紅、GND 黑)和控制板的 D11(Rx)與 D9(Tx)透過軟體序列(software serial)進行交握式通信。兩者間連接方式如圖 5 所示。其中,8787 的 micro USB 接頭可供影像輸出校正監控之用。強烈建議元成校正後請保持 8787 獨立供電,以確保它能正常工作。</div><div><br /></div><div style="text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEi5OBYaEmoMlPOTRZ5FL-uu8XTJqbQixF4GH8yD43kXehWI98m90iV7LBlBZicHO5TQcmyCIAyTRSHOGhDWZZua6BUrPD8QRJAaWom1VMMAHsWmRAHoxO1g3bGIKxP8XY8H3bzdG5ORP0arEduVOqw3gYLQP9CFwyiSoHJVEHiR9-eq7lJMu0dn1w" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="615" data-original-width="1280" height="309" src="https://blogger.googleusercontent.com/img/a/AVvXsEi5OBYaEmoMlPOTRZ5FL-uu8XTJqbQixF4GH8yD43kXehWI98m90iV7LBlBZicHO5TQcmyCIAyTRSHOGhDWZZua6BUrPD8QRJAaWom1VMMAHsWmRAHoxO1g3bGIKxP8XY8H3bzdG5ORP0arEduVOqw3gYLQP9CFwyiSoHJVEHiR9-eq7lJMu0dn1w=w640-h309" width="640" /></a></div><span style="color: #222222; font-size: x-small;">圖 5:8787 接線圖</span><br /><br /></div><div><span><a name='more'></a></span></div></div></span></div></div><div><div style="background-color: white;"><ol style="text-align: left;"><li style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; margin: 0px 0px 0.25em; padding: 0px; text-align: justify;"><span style="font-size: x-small;"><a href="http://creativecommons.tw/explore" style="background-color: transparent; color: #2288bb; font-family: times, "times new roman", serif; text-decoration-line: none;" target="_blank">六種授權條款</a><span face="arial, tahoma, helvetica, freesans, sans-serif" style="background-color: transparent;">。</span></span></li><li style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; margin: 0px 0px 0.25em; padding: 0px; text-align: justify;"><span style="font-size: x-small;">感謝祥儀提供智慧手臂第一手相關文件。</span></li><li style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; margin: 0px 0px 0.25em; padding: 0px; text-align: justify;"><span style="font-size: x-small;">感謝羅傑史丹兒童程式教育學院(<a href="https://www.facebook.com/RogerStanCoding" target="_blank">https://reurl.cc/nZOyRD</a>)提供智慧手臂借測與學生體驗。</span></li><li style="margin: 0px 0px 0.25em; padding: 0px; text-align: justify;"><span style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: x-small;">反推,多電源若不共地,則</span><span style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: x-small;">有人在地下室、有人在大廳,還有人在天花板上,這…要怎玩?</span></li></ol><div style="text-align: justify;"></div></div></div>Ted Leehttp://www.blogger.com/profile/03077454870590095355noreply@blogger.com0tag:blogger.com,1999:blog-1468347421357730785.post-45070456769527236752022-11-05T07:15:00.053+08:002022-11-15T08:02:06.265+08:00[科技宝, Cagebot, 8787, AI, Arduino] 國廠祥儀科技寶智慧手臂 1/3:機構設計篇<h1 style="text-align: center;"> <span style="text-align: center;">國廠祥儀科技寶智慧手臂 1/3:</span></h1><h1 style="text-align: center;">機構設計篇</h1><div style="background-color: white; text-align: center;"><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><a href="https://www.facebook.com/groups/134149180510967/" style="color: #2288bb; text-decoration-line: none;" target="_blank"><span style="font-family: times, "times new roman", serif;">Ted Lee的土饅頭(To Mentor)工坊</span></a></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><div><span style="font-family: times, "times new roman", serif;">Line:ted2016.kpvs</span><br /><span style="font-family: times, "times new roman", serif;">Email:<a href="mailto:Lct4246@gmail.com" target="_blank">Lct4246@gmail.com</a></span><br /><span style="font-family: times, "times new roman", serif;"><span style="font-family: "times new roman", serif;">FB</span>:<a href="http://gg.gg/TedLeeFB/" target="_blank"><span style="font-family: "times new roman", serif;">http://gg.gg/</span><span style="color: #00cc00; font-family: "times new roman", serif;">TedLee</span><span style="color: red; font-family: "times new roman", serif;">FB</span><span style="font-family: "times new roman", serif;">/</span></a></span></div><div><span lang="" style="font-family: times, "times new roman", serif; font-size: 12pt;">Blog<span style="font-family: "times new roman"; font-size: small;">:</span><a href="http://gg.gg/TedLeeBlog/" target="_blank">http://gg.gg/<span style="color: #00cc00;">TedLee</span><span style="color: red;">Blog</span>/</a></span><br /></div></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><span style="font-family: times, "times new roman", serif;"><br /></span></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><span style="font-family: times, "times new roman", serif;">Nov. 5, 2022</span></div><div><span><span style="color: #222222; font-family: times, "times new roman", serif;"><span style="font-size: 13.2px;"><div class="separator" style="clear: both;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s88/CC.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="31" data-original-width="88" height="31" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s1600/CC.png" width="88" /></a>[1]</div></span></span><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><br /></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCzgtkkeRqOwEkksLEkLLr1OnLQ0MYUTCU8Pzi1coOwIVfACI2O1udMOtA7e5_VMFz4mAG1YNbcSSj02IkRGWF9U6OYjodGqf4ocQjTWwEPu-PmtdegJo-ffJm1agLdJEYTH3Ny4JMKp-9vRV9Sia7G9V9RCMrMe7N8zzTmGeNjL19Nb9P1hTY9Q/s2048/S__47652974.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="1537" data-original-width="2048" height="240" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCzgtkkeRqOwEkksLEkLLr1OnLQ0MYUTCU8Pzi1coOwIVfACI2O1udMOtA7e5_VMFz4mAG1YNbcSSj02IkRGWF9U6OYjodGqf4ocQjTWwEPu-PmtdegJo-ffJm1agLdJEYTH3Ny4JMKp-9vRV9Sia7G9V9RCMrMe7N8zzTmGeNjL19Nb9P1hTY9Q/s320/S__47652974.jpg" width="320" /></a> <iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/KjdPjnZZHFI" width="320" youtube-src-id="KjdPjnZZHFI"></iframe> [2][3]</div></div></div></div><div class="separator" style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><br /></div><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify;"><span style="color: #222222;">當國產祥儀塑鋼積木手臂添加了威盛(VIA)的 Pixetto(文後皆以 8787 稱之)AI <b>視覺感測器(vision sensor)</b>(文後皆以</span><span style="color: #222222;">智慧手臂稱之)</span><span style="color: #222222;">會產生什麼綜效?</span><span style="color: #222222; text-align: left;">本系列文章將從機構與機電整合設計兩面向逐一解說這其中的秘辛。</span></div><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify;"><span style="color: #222222;"><br /></span></div><div class="separator" style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;"><div class="separator" style="clear: both; text-align: center; white-space: pre-wrap;"><span><a name="more"></a></span></div></div><h2 style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;">套件學習法</h2><div style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify;"><span style="font-size: small; font-weight: normal;">廠商都幫忙把機構、機電整合、電控程式、教材包成懶人包了,剩下的就只是按圖施工(腦袋空空)了嗎?</span></div><div style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify;"><span style="font-size: small;">一般而言,知識、技能的學習約莫有兩種方式:<b>由上而下(top down)</b>和由<b>下而上(bottom up)</b>,如圖 1 所示。其中,因前者已經有了套件<b>典範(paradigm)</b>,所以我們比較容易將之<b>拆解(decompose)</b>而學習,但會因結果已知而限制了創意的擴散思考設計。然而,從基礎的各個知識點按部就班依序學習完畢後才將之<b>整合(integrate)</b>而的設計亦是另有一番風景。不過,見樹不見林的盲點容易導致學完新的知識就忘了舊的。</span></div><div style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;"><span style="font-size: small;"><br /></span></div><div style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgj6oZDV42qZFz8_rFi_y1jGegpAHRB5Hf5J5t9qmT1L7L3Z4r4Q1Gs5G9U-2ce1glyPVbu-kj-YmW2GBMGV7wvcZECgiC9CF-AHqEmanUoNxuUaUJXTEKjMbrqeV7G_kI0sgPEuVWLvNfc12DckPwDBfRPHu9dAinsiVRYbCewfikPyzf9i24b6g/s535/2%20directions.drawio.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="400" data-original-width="535" height="239" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgj6oZDV42qZFz8_rFi_y1jGegpAHRB5Hf5J5t9qmT1L7L3Z4r4Q1Gs5G9U-2ce1glyPVbu-kj-YmW2GBMGV7wvcZECgiC9CF-AHqEmanUoNxuUaUJXTEKjMbrqeV7G_kI0sgPEuVWLvNfc12DckPwDBfRPHu9dAinsiVRYbCewfikPyzf9i24b6g/s320/2%20directions.drawio.png" width="320" /></a></div><span style="font-size: x-small;">圖 1:兩學習方法論</span></div><div style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;"><span style="font-weight: normal;"><span style="font-size: small;"><br /></span></span></div><div style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify;"><span><span style="font-size: small;">智慧手臂教學採由上而下方式將大部頭的知識點逐一拆解至容易理解的各個小塊知識基元來還原作品設計的各階段歷程,此套件學習法如圖 2 所示。我們期待學員們能以<b>設計師(designer)</b>的視野去綜覽 why、how、…等等緊密的設計思維來欣賞這隻智慧手臂的創造歷程,並經由親手仿作來體驗與學習。</span></span></div><div style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify;"><span style="font-weight: normal;"><span style="font-size: small;"><br /></span></span></div><div style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: center;"><span style="font-weight: normal;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-3WmXW8zWo5tAVqQnX1EcLG70yMr5WpCXPfdPRice-KM5pr-AVoLnXwb1h4oSd9BQgjx6HKWQtY57ZuyAdUpoVUOFVvuWcIpT4MXjxm5uN29h7DjVBv267tni59G9inUgOEyQxJuZU9j3XR5cGwUhFfyuvw-hi-LabZxHUDMtoUWEo97rFEznzQ/s1623/%E5%A5%97%E4%BB%B6%E5%AD%B8%E7%BF%92%E6%B3%95.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="593" data-original-width="1623" height="234" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-3WmXW8zWo5tAVqQnX1EcLG70yMr5WpCXPfdPRice-KM5pr-AVoLnXwb1h4oSd9BQgjx6HKWQtY57ZuyAdUpoVUOFVvuWcIpT4MXjxm5uN29h7DjVBv267tni59G9inUgOEyQxJuZU9j3XR5cGwUhFfyuvw-hi-LabZxHUDMtoUWEo97rFEznzQ/w640-h234/%E5%A5%97%E4%BB%B6%E5%AD%B8%E7%BF%92%E6%B3%95.png" width="640" /></a></div></span></div><div style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: center;"><span style="font-weight: normal;"><span><span style="font-size: x-small;">圖 2:套件學習法</span></span></span></div><div style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify;"><span style="font-weight: normal;"><span style="font-size: small;"><br /></span></span></div><h2 style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;">仿生</h2><div style="text-align: justify;">舉起您的手臂活動活動,覺察一下:圖 3 的 1 處<b>關節(joint)</b>可以 360 度運動,2、3 處只能在限定角度下運動,而 4 處可做抓取。</div><div style="text-align: justify;"><br /></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_gtoQnssEeif6VBWkpmEa0dTrUVEYubq28EQY4_Ldm_q1Z3n6roieQ7usuJ6I8vITPjWgYrAX-q2MAuKOMHyA5E9ESlrozzv8iHl2Qu-S6k6vkmjP6CwSE2dl7wOeAoOaz2v-B2hfEmsgXBYptFZuYIgoWo1da_1oemuSLJhI6GqHKV_aAWAOxg/s622/%E6%89%8B%E8%87%82%E5%9B%9B%E8%BB%B8.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="622" data-original-width="401" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_gtoQnssEeif6VBWkpmEa0dTrUVEYubq28EQY4_Ldm_q1Z3n6roieQ7usuJ6I8vITPjWgYrAX-q2MAuKOMHyA5E9ESlrozzv8iHl2Qu-S6k6vkmjP6CwSE2dl7wOeAoOaz2v-B2hfEmsgXBYptFZuYIgoWo1da_1oemuSLJhI6GqHKV_aAWAOxg/w258-h400/%E6%89%8B%E8%87%82%E5%9B%9B%E8%BB%B8.jpg" width="258" /></a></div><div style="text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; font-size: x-small;">圖 3:人體手臂四關節</span></div><div style="text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; font-size: small;"><br /></span></div><div style="text-align: center;"><div class="separator" style="clear: both; text-align: justify;">圖 4 的智慧手臂設計即是模仿人類的手臂運動,在 1~4 的關節點放上可以帶動的四顆<b>伺服(servo)</b>馬達(SG90 和 MG995)而使得它有四<b>軸(axies)</b>可以在空間中自由的運動。其中,伺服馬達 1 可 0~180 度左右轉動,伺服馬達 2、3 負責控制大、小手臂的上下運動,伺服馬達 4 則控制抓子的開合抓取。</div><br /><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjfCbTAkCRY1yV8Tt_9IrHM5KNDTdHKPj2LdmFkHfl02HYPi1PnKqtwYHCimpbxSJeb5SyPmV9b6mRmIDoXOAVgKCzkmWlHnuDt9UA71C70TMpiuUM2Im4X1K0PZVLhpC4rQAVGXnnZmT_X2JsFZ27zRsE64LG60NIjIK8MEO67KRoFt2iA3Bl3JQ/s710/%E6%A9%9F%E5%99%A8%E6%89%8B%E8%87%82%E5%9B%9B%E8%BB%B8.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="710" data-original-width="546" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjfCbTAkCRY1yV8Tt_9IrHM5KNDTdHKPj2LdmFkHfl02HYPi1PnKqtwYHCimpbxSJeb5SyPmV9b6mRmIDoXOAVgKCzkmWlHnuDt9UA71C70TMpiuUM2Im4X1K0PZVLhpC4rQAVGXnnZmT_X2JsFZ27zRsE64LG60NIjIK8MEO67KRoFt2iA3Bl3JQ/w308-h400/%E6%A9%9F%E5%99%A8%E6%89%8B%E8%87%82%E5%9B%9B%E8%BB%B8.jpg" width="308" /></a></div></div><div style="text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; font-size: x-small;">圖 4:智慧手臂四軸</span></div><div style="text-align: justify;"><br /></div><div style="text-align: justify;"><h2 style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;">參考設計:MeArm</h2><div>筆者在約莫數年前即接觸了著名的機器手臂<b>開源(open source)</b>專案 MeArm(<a href="https://reurl.cc/oZ1ArV">https://reurl.cc/oZ1ArV</a>),它是由底盤、大手臂、小手臂和夾子四段所組成(<a href="https://reurl.cc/QWLGNZ">https://reurl.cc/QWLGNZ</a>),</div><div><br /></div><div><blockquote>模仿人手動作的秘密在於四個馬達,前方馬達控制爪子的開合;左左兩個馬達用來控制手臂前後伸展及上下移動;安置於下方的馬達是讓整組機身左右旋轉。 ~<a href="https://reurl.cc/gQ212N">https://reurl.cc/gQ212N</a></blockquote><a href="https://reurl.cc/gQ212N"></a></div><div><br /></div><div>請讀者們自行比較智慧手臂和它運動方式的異同之處。</div><div><br /></div><div><div><h2 style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;">機構組裝</h2><div>根據祥儀提供的第一手組裝指引,我們將之轉檔成圖 5 的影片供讀者們參考。我們強烈建議讀者們根據圖 4 所標示的軸編號,依照數字順序組裝時,每裝妥一軸即輕輕(太大力轉動會使伺服馬達齒輪損壞)轉動觀察它們是如何動作的─對比於人的手臂和 MeArm 設計的異同點為何?</div><div><br /></div></div><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/092uFmv17nA" width="320" youtube-src-id="092uFmv17nA"></iframe></div><div style="text-align: center;"><span style="font-size: x-small;">圖 5:智慧手臂組裝</span></div><div style="text-align: center;"><br /></div><div></div></div><div><h2 style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;">開光:智慧視覺感測器(smart vision sensor)</h2><div>如圖 6 所示的 demo 影片,智慧手臂使用了 8787 內建的<b>顏色偵測(color detection)</b> AI 模型,並實現了有色物件自動追蹤的示例。機電整合及電控程式的分析將以後文詳述之。</div><div>關於 8787 一系列的介紹文章,可以參考筆者所著的「假 a 真 i(<a href="https://reurl.cc/28ZV5a">https://reurl.cc/28ZV5a</a>)」專網。</div><div><br /></div></div><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/KjdPjnZZHFI" width="320" youtube-src-id="KjdPjnZZHFI"></iframe></div><div style="text-align: center;"><span style="font-size: x-small;">圖 6:有色物件自動追蹤手臂</span></div><div><br /></div><div><h2 style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;">生活中的機器手臂應用</h2><div>處在這個科技爆發的時代,我們更期待著新技術能從自動化進入到智慧化,乃至最後可以達到無人化的全新應用領域。像是從<a href="https://www.youtube.com/watch?v=7UbzYNWOPb8" target="_blank">工廠自動化</a>、<a href="https://www.youtube.com/watch?v=WxFtV5P0ZM0&fbclid=IwAR3PdDjevOSFnfoVMgh7VR_N2qH5nEqCs6o-eH5YdxtmGEwRxEGIVXM7CkA" target="_blank">自動物流</a>、<a href="https://www.youtube.com/watch?v=C5_tKR5Un8g&fbclid=IwAR0u6HFotWc-CKpQd4IHYbzxWyaOndtw4dOW-giHJUSphpaPJnOelBxkIK0" target="_blank">智慧工廠</a>,到<a href="https://www.youtube.com/watch?v=Wq-TYQtywHY" target="_blank">無人咖啡店</a>,再到<a href="https://www.youtube.com/watch?v=sS8NnysIM-8&fbclid=IwAR35Kr_wgQCCUOaSFSe5FxavyGx5wWdqTQIFan03VhR7krMgJF7kZ4ogLVA" target="_blank">藝術創作</a>或者是<a href="https://www.youtube.com/watch?v=kQ0jIZ6GqGc&fbclid=IwAR0u6HFotWc-CKpQd4IHYbzxWyaOndtw4dOW-giHJUSphpaPJnOelBxkIK0" target="_blank">手術機器人</a>,智慧手臂開始有了更進一步的生活應用。然而智慧手臂的設計還是從這些<a href="https://www.youtube.com/watch?v=GRz1ZJtDwd8&fbclid=IwAR1bEe5Jfs1vL0lcUiViC4O8JXYxUBJwKvm_787ZJWM3Z2a7rY5lXasGbIQ" target="_blank">基礎學習</a>開始的。因此,不管是由上而下的套件學習法或者是由下而上的按部就班學習法,找到自己的學習興趣仍是自我學習的重要任務──喜歡智慧手臂的讀者們,就從這裡開始吧!</div><div><br /></div><div><h2 style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;">翦影</h2><div>關於本智慧手臂教學照片請有興趣的讀者參考 <a href="https://www.facebook.com/RogerStanCoding/posts/pfbid0zoMuz9imbPUoLahEMw3sTsrDygY96SLhPaGeZnbDCxtu6aWvgrJs5MSpbfdg56ecl?__cft__[0]=AZXWJQmZJwlauP6ECuMk6cjCqyNRec2VShlpCEJ_sIWf2khK-regenqjhELdgvVXyrv1JF652P6HNLNiTYRPZLnNvcWtVwYGB4E2wF0T6f0lQGZSdND73vACEGwREdhDdHsVEidw7Rk2G3qJaemepCWN&__tn__=%2CO%2CP-R" target="_blank">1</a>、<a href="https://www.facebook.com/RogerStanCoding/posts/pfbid02MksQbqvNLxnhnucB43V6x2Nvxbo1aJmwuBjqF9vPTAL1jyN5LeGWjyEF5a2m8Nvgl?__cft__[0]=AZXwh1M1uhsdkf6c82LRoK9k545OEi6L9HyU-H_P3KpH2eM2hOSEEC0POvrlfuytyQOx3n0AxB5cd-8pfU-K30cmLnGCLIHw9rWtnjChFiZXNQ6eRxlxn2VUS_EWSRbdOxR5LxgcxRZ-DuPJvqKJ3eta8HcQ_Nmx0RjUbgJtF-oIF2YFdGwdxxFkY78lfE958UI&__tn__=%2CO%2CP-R" target="_blank">2</a>、<a href="https://www.facebook.com/RogerStanCoding/posts/pfbid0SjBig7KYg29iSz47NpQPF1ukCbh335ZnShN5pEjyojwoUjo3pMBCcLqBP3t9zBbNl?__cft__[0]=AZXZB3TXg9Bcdft3Bnetd2z2beV3ANFyT9HXc7-oK3-CAvW9nE4b37htfT0pFslddKKC5hhW-0mLBTHUH9cg0O_Ry51lNpw15xahLLUO--3F1zkAmgj0VJfevEbJ8JCTtHT-F0nL2fo_mGvAQCzF5-B3&__tn__=%2CO%2CP-R" target="_blank">3</a>、<a href="https://www.facebook.com/RogerStanCoding/posts/pfbid02pcrw8LcJJm2KZmpMMJVQ9gxmqbnuW1xfJShgLUtswfm252vSNq16b8AwvbDRjJHbl?__cft__[0]=AZVcGwlANbOTKxo8SIhkq3D02XOr6V3v9Y_O1ZeclXMy0gzgYgrTBZW5j5i6mbb8aXOyvSCstJiCiEsVfaFq6UhIpKOqYiViWV1C4D-g0aJR7_SyJNX9OZqyrPZqdK6iMbO55BOJltBEkCIA9BJwP3ZC&__tn__=%2CO%2CP-R" target="_blank">4</a>、<a href="https://www.facebook.com/RogerStanCoding/posts/pfbid0LRYs3aU6VcWmSYk4s6Y8RQd8xNhVNzG1siHzpCL7oFUcWPD8hLsM3cT7tp2NTS9ol?__cft__[0]=AZXqJx0k-42tPqzq02EkH_YDsjpnLj2OSLalyJvM0Mf2qNqbBpxP7FJTRUTj0M75btUqRW99VEX1FMNvFHOZO9Ajoclesoun2LYYCq44HjIvHzZCsBydH6amkMff1gSKn-simmWmFIDymykqhWHsyM-T&__tn__=%2CO%2CP-R" target="_blank">5</a>、<a href="https://www.facebook.com/RogerStanCoding/posts/pfbid0Yfk5RXWVgK7ZaViDJhuAYAEUzjk9DveLnrCHnM5TV7qSTaBDXAUJLyZF1N3fsxhel" target="_blank">6</a>、<a href="https://www.facebook.com/tycgmjh/posts/pfbid02QiYkNSN5k8R3m8aag8r6A4pQC6fac7cM8eZmCTHw7CdopHwUW22zeHMoaQG2pBu3l?__cft__[0]=AZWtVaWWp6PsaZuI23ETCVjx0zw2KwFFGnq-plp7ZbcE6YLXK_eusObgDt1skAtmJTeAPX6lIz2I2NRwEF7fqtgcJW-UMggOrbiHDR6zTxHDlfsoTBJ6jHjw6R4iQPOoKTkpaMU7KqDib_k7268noU6T&__tn__=%2CO%2CP-R" target="_blank">7</a>、<a href="https://www.facebook.com/gmjhGENIUS/posts/pfbid02gDTSEbb39xYXwDGesP7NssH8R2fqekQ1rJBZhkXfJDRcCqgtMpUCA2MEZyQwVMYJl?__cft__[0]=AZWgUYlfNoXaY_DzcySN7wh9g8HdfP58wxczHrj55bRAc6FTYXDzUutbxVrK4Nic-l-T-kXNPbcXHvQ0KUpSYXZAemQDd7Z8zpRscqFyCjJsl6QlIi6KzlWedTZ3sYJ5iQFbe0y5tME02kHP_ZMize-A&__tn__=%2CO%2CP-R" target="_blank">8</a>。桃園蘆竹五校聯合 AI 教育成果發表會之成果影片請參考圖 7 中之連結連入觀看。</div></div><div><br /></div><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/jP3MBlmqLuE" width="320" youtube-src-id="jP3MBlmqLuE"></iframe> <iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/lN1PC_YE7Cs" width="320" youtube-src-id="lN1PC_YE7Cs"></iframe></div><div class="separator" style="clear: both; text-align: center;"><span style="font-size: x-small;">圖 7:成果發表會影片</span></div><span><a name='more'></a></span></div></div></span></div></div><div><div style="background-color: white;"><ol><li style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; margin: 0px 0px 0.25em; padding: 0px; text-align: justify;"><span style="font-size: x-small;"><a href="http://creativecommons.tw/explore" style="background-color: transparent; color: #2288bb; font-family: times, "times new roman", serif; text-decoration-line: none;" target="_blank">六種授權條款</a><span face="arial, tahoma, helvetica, freesans, sans-serif" style="background-color: transparent;">。</span></span></li><li style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; margin: 0px 0px 0.25em; padding: 0px; text-align: justify;"><span style="font-size: x-small;"><span face="arial, tahoma, helvetica, freesans, sans-serif" style="background-color: transparent;">感謝祥儀提供智慧手臂第一手相關文件。</span></span></li><li style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; margin: 0px 0px 0.25em; padding: 0px; text-align: justify;"><span style="font-size: x-small;"><span face="arial, tahoma, helvetica, freesans, sans-serif" style="background-color: transparent;">感謝羅傑史丹兒童程式教育學院(<a href="https://www.facebook.com/RogerStanCoding" target="_blank">https://reurl.cc/nZOyRD</a>)提供智慧手臂借測與學生體驗。</span></span></li></ol></div></div>Ted Leehttp://www.blogger.com/profile/03077454870590095355noreply@blogger.com0tag:blogger.com,1999:blog-1468347421357730785.post-56922786010746041042022-10-31T07:43:00.043+08:002022-11-04T17:10:03.607+08:00[fChart, Python, 資料結構] 以 fChart 馭 Python:陣列(array)(9/11)<h1 style="text-align: center;"> <span style="text-align: center;">以 fChart 馭 Python:</span></h1><h1 style="text-align: center;">陣列(array)</h1><div style="background-color: white; text-align: center;"><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><a href="https://www.facebook.com/groups/134149180510967/" style="color: #2288bb; text-decoration-line: none;" target="_blank"><span style="font-family: times, "times new roman", serif;">Ted Lee的土饅頭(To Mentor)工坊</span></a></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><div><span style="font-family: times, "times new roman", serif;">Line:ted2016.kpvs</span><br /><span style="font-family: times, "times new roman", serif;">Email:<a href="mailto:Lct4246@gmail.com" target="_blank">Lct4246@gmail.com</a></span><br /><span style="font-family: times, "times new roman", serif;"><span style="font-family: "times new roman", serif;">FB</span>:<a href="http://gg.gg/TedLeeFB/" target="_blank"><span style="font-family: "times new roman", serif;">http://gg.gg/</span><span style="color: #00cc00; font-family: "times new roman", serif;">TedLee</span><span style="color: red; font-family: "times new roman", serif;">FB</span><span style="font-family: "times new roman", serif;">/</span></a></span></div><div><span lang="" style="font-family: times, "times new roman", serif; font-size: 12pt;">Blog<span style="font-family: "times new roman"; font-size: small;">:</span><a href="http://gg.gg/TedLeeBlog/" target="_blank">http://gg.gg/<span style="color: #00cc00;">TedLee</span><span style="color: red;">Blog</span>/</a></span><br /></div></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><span style="font-family: times, "times new roman", serif;"><br /></span></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><span style="font-family: times, "times new roman", serif;">Oct. 31, 2022</span></div><div><span><span style="color: #222222; font-family: times, "times new roman", serif;"><span style="font-size: 13.2px;"><div class="separator" style="clear: both;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s88/CC.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="31" data-original-width="88" height="31" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s1600/CC.png" width="88" /></a>[1]</div></span></span><div class="separator" style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: left;"><br /></div><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify;"><span style="color: #222222;">接續著本 fChart 系列前文《<a href="https://lct4246.blogspot.com/2021/12/fchart-python-fchart.html" target="_blank">以 fChart 馭 Python:練 fChart 了沒?(1/11)</a>》(<a href="https://reurl.cc/oeDGN3">https://reurl.cc/oeDGN3</a>),我們將針對</span>圖1 的「10 大項目之 8」<span style="color: #222222;">的 14 個實例</span><span style="color: #222222; text-align: center; white-space: pre-wrap;">(可從<a href="https://reurl.cc/RXXDqr" target="_blank">https://reurl.cc/RXXDqr</a> </span><span style="color: #222222; text-align: center; white-space: pre-wrap;">下載)</span><span style="color: #222222;">,從</span></div><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;"><span></span><blockquote style="text-align: center;"><span></span><span></span><span></span><span></span><span></span><span></span><blockquote><span></span></blockquote></blockquote><blockquote><blockquote style="text-align: center;"><blockquote><span>原始問題描述</span><span>到</span><span>以流程圖表達解法</span><span>,</span></blockquote></blockquote><blockquote style="text-align: center;"><blockquote><span>再對照流程圖寫出 Python 語法程式</span></blockquote></blockquote></blockquote><blockquote style="text-align: center;"><blockquote><span></span></blockquote><span></span><blockquote><span></span></blockquote><span></span></blockquote><blockquote style="text-align: center;"><span></span></blockquote><blockquote style="text-align: center;"><span></span></blockquote><blockquote style="text-align: justify;"><span></span></blockquote><span></span></div><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify;"><span style="color: #222222;">的過程詳細說明整個</span><span style="color: #222222;">的</span><b><span style="color: #222222;">問題解決</span><span style="color: #222222; white-space: pre-wrap;">(problem solving)</span></b><span style="color: #222222;">過程。</span></div><div class="separator" style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;"><div class="separator" style="clear: both; text-align: center; white-space: pre-wrap;"><div class="separator"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; font-size: 13.2px;"><div class="separator" style="clear: both;"><br /></div></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; font-size: 13.2px;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjYh9zHcs0fvxCnpPh70FkOhTCV23kUiibc4JIbt5SxJxRkA9X_YlGvOX0H7eRFZzhDLiQHjvGbb8t3VsVzj66ZIDKJZi1Qk4CaWVjH9aNhXvTWfsjJc6bqFsvpblzHb9Kwcn9UQz-THZj7NvzHQN9rPLbs387tWSUmOL2n_5bk6s_lYOPUpn4uUw" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="333" data-original-width="446" height="239" src="https://blogger.googleusercontent.com/img/a/AVvXsEjYh9zHcs0fvxCnpPh70FkOhTCV23kUiibc4JIbt5SxJxRkA9X_YlGvOX0H7eRFZzhDLiQHjvGbb8t3VsVzj66ZIDKJZi1Qk4CaWVjH9aNhXvTWfsjJc6bqFsvpblzHb9Kwcn9UQz-THZj7NvzHQN9rPLbs387tWSUmOL2n_5bk6s_lYOPUpn4uUw" width="320" /></a></div></div></div></div><div class="separator" style="clear: both;"><span style="font-size: x-small;">圖 1:10 大項目之 8</span></div></div></div></div></div></div></div></div></div><div class="separator" style="clear: both; text-align: center; white-space: pre-wrap;"><span><a name="more"></a></span></div></div><h2 style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;">陣列使用三部曲</h2><div style="text-align: justify;">陣列是什麼?如果我們用「鞋盒」來比擬「變數」,那麼數十雙的鞋子就得準備數十個鞋盒來放置鞋子,這時就有添加「鞋櫃」的必要了──陣列就像這個放鞋子的鞋櫃,它特別適合拿來儲存大量的資料以待後續處理。在圖 2 的邏輯示意圖中,我們建立了一個叫 list 的陣列,list 中的位置從 0 開始往下遞增一號。而每個位置中儲存的資料稱之為<b>元素(element)</b>。</div><div style="text-align: justify;"><br /></div><div style="text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEhbEY2aE8RB54o8MBvetZ8DJlN9CCWjyzBTFFD27pPeEF6X0fq_pCqVc6dWOe3VfbMNVH6zlKHISf0zarfH387xt4DHd8JwXxKT-oiHz_svuWZhfT5fR8kINIImsJEpvRPFSTnHS_y5Uk9Whn64B5SNuO9kuU3iPE-YYXll8CsaeJr64HdZgglfwg" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="184" data-original-width="842" height="88" src="https://blogger.googleusercontent.com/img/a/AVvXsEhbEY2aE8RB54o8MBvetZ8DJlN9CCWjyzBTFFD27pPeEF6X0fq_pCqVc6dWOe3VfbMNVH6zlKHISf0zarfH387xt4DHd8JwXxKT-oiHz_svuWZhfT5fR8kINIImsJEpvRPFSTnHS_y5Uk9Whn64B5SNuO9kuU3iPE-YYXll8CsaeJr64HdZgglfwg=w400-h88" width="400" /></a></div></div><div style="text-align: center;"><span style="font-size: small;">圖 2:陣列的邏輯圖示</span></div><div style="text-align: center;"><br /></div><div style="text-align: justify;">程式設計中為什麼要使用陣列 [2]?我們以當紅炸子機人工智慧 AI 的<b>影像處理(image processing)</b>技術來說明要將一張張高解析度照片<b>載入(load)</b>到 CPU P 圖之前,需事前先將存放在大容量<b>外部儲存媒體(external storage)</b>中的原始圖片檔載入到<b>記憶體(memory)</b>內。因此,P 圖程式才能將這些影像資料透過數學計算處理。也就是說,在開始處理相片的<b>像素(pixel)</b>內含(<a href="https://reurl.cc/91EgvV" target="_blank">https://reurl.cc/91EgvV</a>)之前,程式中需要有一個對應的機制來暫時存放這些待運算的影像資料。而對比於數學矩陣的陣列結構就正好符於所需了(圖 1)。</div><div style="text-align: justify;"><br /></div><div style="text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8R0TuQu75V--46sGhxvqAJ3r-BYN5FomwH0xzHJYo_aKWtT_EACqFXaXpIlo9gqt77NVLqUMICqyxSegH9MVIk61fBc3dBWf0VfT2uM3xJLogHDz0-pfcjXG7h6fM6POdcq9fAfZGFKhRlSJDUd-BUX5dcX_l0PITfXZosITUY3p8XrEO-vDe9w/s2364/107555.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="2364" data-original-width="1773" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8R0TuQu75V--46sGhxvqAJ3r-BYN5FomwH0xzHJYo_aKWtT_EACqFXaXpIlo9gqt77NVLqUMICqyxSegH9MVIk61fBc3dBWf0VfT2uM3xJLogHDz0-pfcjXG7h6fM6POdcq9fAfZGFKhRlSJDUd-BUX5dcX_l0PITfXZosITUY3p8XrEO-vDe9w/s320/107555.jpg" width="240" /></a> <a href="https://blogger.googleusercontent.com/img/a/AVvXsEiuKXkkiZzl41joCPCkEAv6AdN15pwhWWpl9-MXyTX6iJ0emT8PLM228bKgqrM3AJBF2uknxN9lYICkAvY25EZFEJyWuTCZs3DMQokWJsh5UZTRHDQ8DCTOfCey-UHcDzAzcFlluOAS3J9DDqWIHxstmQFo4PJTZrtiOlo_aXdKYt-qWpJC2tKeug" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="1080" data-original-width="1920" height="180" src="https://blogger.googleusercontent.com/img/a/AVvXsEiuKXkkiZzl41joCPCkEAv6AdN15pwhWWpl9-MXyTX6iJ0emT8PLM228bKgqrM3AJBF2uknxN9lYICkAvY25EZFEJyWuTCZs3DMQokWJsh5UZTRHDQ8DCTOfCey-UHcDzAzcFlluOAS3J9DDqWIHxstmQFo4PJTZrtiOlo_aXdKYt-qWpJC2tKeug" width="320" /></a></div><span style="font-size: x-small;">圖 1:照片內部的像素資料</span><br /><br /></div><div style="text-align: justify;">陣列使用有三個基本動作,我們將之稱為陣列使用的三部曲(本文使用「Code Editor」來介紹 Python 中陣列的使用語法)。詳細分述如下:</div><div style="text-align: justify;"><ol><li><b><span style="color: #2b00fe;">建立(create)</span></b>:依照圖 3 的選項操作建立一個名叫 list 的陣列,它的初始內容是空的(第 1 行)。註:第 2-3 行指定它的初始值。<br /><span style="color: red;">Python 語法:陣列名稱 = [初值 1, 初值 2, ...]</span></li><li><span style="color: #2b00fe;">存</span>:依照圖 4 的選項操作,在第 3 和 5 行,使用指定<b>運算子(operator)</b> = 在 list 的編號 1 和 2 位置存入新值 10 和字串 Joe Chen。<br /><span style="color: red;">Python 語法:陣列名稱[位置] = 指定值</span></li><li><span style="color: #2b00fe;">取</span>:取出 list 陣列中位置 0、1 和倒數第 1 和 2 個元素內容。<br /><span style="color: red;">Python 語法:陣列名稱[位置]</span></li></ol><br /></div><div><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEina_kKQT-vm6LiILdqYCCK4ao_vX5PAOGRklOkbH0vdpWpfA3JmLhubUsqH4L8lzZkUqtiXzJeh5U6YpVuPdTCT9fpC41YqPRzj-Hw6MED4ZVl6mmKgfmMo9sfykZ5Rc93mlNbjruY5uZgneoqZ0oMyUZbc3oThvmx7BcrnoFKcN_f5Ih9r0HYjA" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="383" data-original-width="1240" height="198" src="https://blogger.googleusercontent.com/img/a/AVvXsEina_kKQT-vm6LiILdqYCCK4ao_vX5PAOGRklOkbH0vdpWpfA3JmLhubUsqH4L8lzZkUqtiXzJeh5U6YpVuPdTCT9fpC41YqPRzj-Hw6MED4ZVl6mmKgfmMo9sfykZ5Rc93mlNbjruY5uZgneoqZ0oMyUZbc3oThvmx7BcrnoFKcN_f5Ih9r0HYjA=w640-h198" width="640" /></a></div></div><span style="font-size: x-small;">圖 3:建立陣列</span></div><div style="text-align: center;"><div class="separator" style="clear: both; text-align: center;"><br /></div></div><div style="text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEgJuJYwj6SxM0qM-R0Bvw37-rVJCak00B5LsdtO9OgL9qukLZaG4b7iMgDpIaMpEpeUKV4CS8cKrUawdfiTLX5YB46nlaNKazkDKXWiv_PDR3fyKpFxmpYnLoTsXI3Z2zLhwIMUyD1bJrQdfGhHBmeNZ-8OU26SD5PDoU7FAikl1f31zaCGU6Fh9Q" style="margin-left: 1em; margin-right: 1em; outline-width: 0px; user-select: auto;"><img alt="" data-original-height="384" data-original-width="1268" height="194" src="https://blogger.googleusercontent.com/img/a/AVvXsEgJuJYwj6SxM0qM-R0Bvw37-rVJCak00B5LsdtO9OgL9qukLZaG4b7iMgDpIaMpEpeUKV4CS8cKrUawdfiTLX5YB46nlaNKazkDKXWiv_PDR3fyKpFxmpYnLoTsXI3Z2zLhwIMUyD1bJrQdfGhHBmeNZ-8OU26SD5PDoU7FAikl1f31zaCGU6Fh9Q=w640-h194" width="640" /></a></div><span style="font-size: x-small;">圖 4:將元素存至陣列</span><br /></div><div style="text-align: justify;"><br /></div><div style="text-align: justify;"><div style="text-align: center;"><div class="separator" style="clear: both;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjgKjrR7ksubI2Hugr5NuI7snkLU2x510wRy29zxKAOPt5umtiXftHVbkol7zCNtPnM_1o3MlP_StYOqb297aOTllO-2eYFyDgRYPmU1AqPOf4xZKeVJNV9w0SH3jICLhIJgezSt69mQ1aGOqk6wXr2iz2DhHqcGDJ0U_r8gI9X4Wc6jLCwQfuWFQ" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="382" data-original-width="1267" height="192" src="https://blogger.googleusercontent.com/img/a/AVvXsEjgKjrR7ksubI2Hugr5NuI7snkLU2x510wRy29zxKAOPt5umtiXftHVbkol7zCNtPnM_1o3MlP_StYOqb297aOTllO-2eYFyDgRYPmU1AqPOf4xZKeVJNV9w0SH3jICLhIJgezSt69mQ1aGOqk6wXr2iz2DhHqcGDJ0U_r8gI9X4Wc6jLCwQfuWFQ=w640-h192" width="640" /></a></div><span style="font-size: x-small;">圖 5:取用陣列元素</span><br /></div></div><div style="text-align: justify;"><br /></div><span><a name="more"></a></span><h2 style="text-align: justify;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; text-align: left;">原始問題</span></h2><div class="separator" style="clear: both; text-align: left;"><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify; white-space: pre-wrap;"><div class="separator" style="clear: both; white-space: normal;"><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="color: #222222;">我們試圖把會安老師編排的範例一一還原到初始的問題形式來帶領讀者們思考:</span></div><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="color: #222222;"><br /></span></div><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="color: #2b00fe;"></span><blockquote><span style="color: #2b00fe;">問題</span><span style="color: #222222;"> --- </span><span style="color: red;">流程圖</span><span style="color: #222222;"> ---> </span><span style="color: #2b00fe;">解法</span></blockquote><span style="color: #2b00fe;"></span></div><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="color: #222222;"><br /></span></div><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="color: #222222;">一連串的</span><span style="color: #222222;">問題解決</span><span style="color: #222222;">奇幻之旅。筆者再次強調,</span></div><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="color: #222222;"><br /></span></div><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="color: #222222;"><blockquote>「解決問題」是編程訓練的終極目的,而「流程圖」乃為邏輯表達之母(積木拼圖湊答案不是)。</blockquote></span></div></div></div><span style="color: #222222;"><h4></h4></span><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="text-align: justify;"><div class="separator" style="clear: both; text-align: left;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="text-align: justify;"><span style="color: black;"><span style="color: #222222;">1. </span><b>08-01.輸入與顯示一維陣列元素</b><span style="color: #222222;">:將由鍵盤輸入的三個數字儲存至陣列後印出其內容</span><a href="https://blogger.googleusercontent.com/img/a/AVvXsEgUKZHe7Nspp1VbqjPCOFX_zXuYF0-HB4OvJzlO4fftDKyEvHQiCW57qlf_THyUPbobiDhdpx8ofq1HE3pEkdV7g3pRVidOwZR69_J2-Rp9SdOl7r1PB7GgZjZFTfzyo8n8CVs6hOEx_LTodN5mJuTPiYlM-TGWTFh2mlx7OG_IiObwWuLki4tZ6A" style="margin-left: 1em; margin-right: 1em; text-align: center;"><img alt="" data-original-height="126" data-original-width="196" height="105" src="https://blogger.googleusercontent.com/img/a/AVvXsEgUKZHe7Nspp1VbqjPCOFX_zXuYF0-HB4OvJzlO4fftDKyEvHQiCW57qlf_THyUPbobiDhdpx8ofq1HE3pEkdV7g3pRVidOwZR69_J2-Rp9SdOl7r1PB7GgZjZFTfzyo8n8CVs6hOEx_LTodN5mJuTPiYlM-TGWTFh2mlx7OG_IiObwWuLki4tZ6A=w164-h105" width="164" /></a></span><span style="color: black;">。</span></span></div><span style="color: #222222;">2. </span><b style="color: #222222;">08-</b></span><span style="text-align: center;"><span style="color: #222222;"><b>02.更改與取出陣列元素值</b></span></span><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="text-align: justify;"><span style="color: #222222;">:存取陣列中的元素<a href="https://blogger.googleusercontent.com/img/a/AVvXsEiLLpYhyUB5JAXakes30wQOpQwIGSQwvLddUQCWShYRlinKSyEzk4lubEngG85qs1JXzIdYQdwfpdNu7OrFnEV0dB4xDLYiiA6n2h6OdpojVxDQIJszFNRzm4nxisMk-tdKEWnmGGmRADmuLhTSoyjqclf1Bd6n-BEvR5vdXXTK4czS_2JCkYMFHg" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="86" data-original-width="152" height="70" src="https://blogger.googleusercontent.com/img/a/AVvXsEiLLpYhyUB5JAXakes30wQOpQwIGSQwvLddUQCWShYRlinKSyEzk4lubEngG85qs1JXzIdYQdwfpdNu7OrFnEV0dB4xDLYiiA6n2h6OdpojVxDQIJszFNRzm4nxisMk-tdKEWnmGGmRADmuLhTSoyjqclf1Bd6n-BEvR5vdXXTK4czS_2JCkYMFHg=w122-h70" width="122" /></a></span></span><span style="text-align: justify;">。</span></div><div class="separator" style="clear: both; text-align: left;"><span style="text-align: justify;">3. <b>08-</b></span><span style="text-align: center;"><b>03.在運算式中使用陣列元素</b></span><span style="text-align: justify;">:使用陣列完成溫度度量轉換計算<a href="https://blogger.googleusercontent.com/img/a/AVvXsEiI1GE0pXUu39nix19Md59iMXgYqc-S_PUjjs9SHCBEl48E81gmqVdfZANGQze7bwmS7NjGb4H5SdFzzwPO9aHrKqEM6pi_1yEnFkUMbSIw0UU0IzwVznySKwT3VkTt8_3eXlYJQoucTp90nKLbvsolHifZb3Cpui59op-eGFq1N29jVHduYcdhBQ" style="margin-left: 1em; margin-right: 1em; text-align: center;"><img alt="" data-original-height="67" data-original-width="241" height="53" src="https://blogger.googleusercontent.com/img/a/AVvXsEiI1GE0pXUu39nix19Md59iMXgYqc-S_PUjjs9SHCBEl48E81gmqVdfZANGQze7bwmS7NjGb4H5SdFzzwPO9aHrKqEM6pi_1yEnFkUMbSIw0UU0IzwVznySKwT3VkTt8_3eXlYJQoucTp90nKLbvsolHifZb3Cpui59op-eGFq1N29jVHduYcdhBQ=w192-h53" width="192" /></a>。以變數實現的版本請參考拙著《以 fChart 馭 Python:運算子與運算式(<a href="https://reurl.cc/EXn8r1" target="_blank">https://reurl.cc/EXn8r1</a>)》</span><span style="text-align: justify;">。</span></div><div class="separator" style="clear: both; text-align: left;"><div class="separator" style="clear: both;"><span style="text-align: justify;"><div class="separator" style="clear: both; text-align: left;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; text-align: justify;"><div class="separator" style="clear: both; font-weight: bold; text-align: left;"><span><a name="more"></a></span></div><div class="separator" style="clear: both; font-weight: bold; text-align: left;"><h2 style="clear: both;"></h2></div></span></div><div class="separator" style="clear: both; text-align: left;"><h2 style="clear: both; text-align: justify;"><span style="color: #222222; text-align: left;">流程圖與 Python 語法對轉</span></h2></div></span></div></div><div class="separator" style="clear: both; text-align: left;"><div class="separator" style="clear: both;"><div style="text-align: justify;"><h3><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span><span style="font-weight: 400;">1.</span><span><span style="font-weight: 400;"> </span></span></span><span>08-01.輸入與顯示一維陣列元素<span style="font-weight: 400;">:根據流程圖</span></span></span></span><span style="font-size: small;"><span style="color: #222222; font-weight: 400; text-align: right;"><span><span><span style="color: black;">將 </span></span></span></span><span style="color: black; font-weight: 400; text-align: left;">Python 程式</span><span style="color: black; font-weight: 400; text-align: left;">轉換妥後</span><span style="color: black; font-weight: 400;">以「</span><span style="color: black; text-align: center;"><span><span style="font-weight: 400; white-space: pre-wrap;">08-01.輸入與顯示一維陣列元素」存檔執行</span></span></span><span style="color: black; font-weight: 400;">後就能看到</span><span style="color: black; font-weight: 400; text-align: left;">如圖 6</span><span style="color: black; font-weight: 400; text-align: left;"> 所對應的</span><span style="color: black; font-weight: 400;">執行結果。</span></span></div><div class="separator" style="clear: both;"><span style="font-size: small;"><span style="color: black; font-weight: 400;"><br /></span></span></div></h3><h3><div class="separator" style="clear: both; font-size: medium; font-weight: 400;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="color: black; font-size: small;"><div></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="text-align: justify;"><span></span></div></div></div></span></span></div></h3><h3><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span style="font-weight: 400;"></span></span></span></div><div class="separator" style="clear: both; font-weight: 400; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><div class="separator" style="clear: both; font-size: medium;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEidyBgogAEjLS85hqTUX5D2OK7G5qm2OYYAp7HWgzFRi2d5G14NrPC3CS1g2MpVSTUAXDyIRqPcz3P2qXRz_DEEeYIWR8giq-6VW_nkAaQ9EH59tG_ySoaqIY7ePgEqfzbRRIms9mBUFFMbTNCNQAFviM4smm7K4v869qEdmKri9qTwnZwJDtGpTA" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="753" data-original-width="1668" height="288" src="https://blogger.googleusercontent.com/img/a/AVvXsEidyBgogAEjLS85hqTUX5D2OK7G5qm2OYYAp7HWgzFRi2d5G14NrPC3CS1g2MpVSTUAXDyIRqPcz3P2qXRz_DEEeYIWR8giq-6VW_nkAaQ9EH59tG_ySoaqIY7ePgEqfzbRRIms9mBUFFMbTNCNQAFviM4smm7K4v869qEdmKri9qTwnZwJDtGpTA=w640-h288" width="640" /></a></div></div></div><div class="separator" style="clear: both;"><span style="font-size: x-small;"><span style="color: black;">圖 6:</span><span style="color: black;">將鍵盤輸入的值存到陣列中後印出其內容</span></span></div></span></div></h3><h3><div class="separator" style="clear: both;"><span style="color: #222222; font-size: small;"><span style="color: #222222;"><span style="font-weight: 400;">2. </span>08-02.更改與取出陣列元素值</span><span style="color: black; font-weight: 400;"><span style="color: #222222;">:</span></span></span><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span><span style="font-weight: 400;">根據流程圖</span></span></span></span><span style="font-size: small;"><span style="color: #222222; font-weight: 400; text-align: right;"><span><span><span style="color: black;">將 </span></span></span></span></span><span style="color: black; font-size: medium; font-weight: 400; text-align: left;">Python 程式</span><span style="color: black; font-size: medium; font-weight: 400; text-align: left;">轉換妥後</span><span style="color: black; font-size: medium; font-weight: 400;">以「</span><span style="color: black; font-size: medium; text-align: center;"><span><span style="font-weight: 400; white-space: pre-wrap;">08-02.更改與取出陣列元素值.py」存檔執行</span></span></span><span style="color: black; font-size: medium; font-weight: 400;">後就能看到</span><span style="color: black; font-size: medium; font-weight: 400; text-align: left;">如圖 7</span><span style="color: black; font-size: medium; font-weight: 400; text-align: left;"> 所對應的</span><span style="color: black; font-size: medium; font-weight: 400;">執行結果。</span></div><div class="separator" style="clear: both;"><span style="color: black; font-size: medium; font-weight: 400;"><br /></span></div><div class="separator" style="clear: both;"><span style="color: #222222; font-size: medium; font-weight: 400;"><div class="separator" style="clear: both; text-align: center;"></div></span><div style="text-align: center;"><span style="font-size: x-small; font-weight: 400;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEj6fWX_aa1KNF1T4l1FDSLISpVml-9NBLFvD0_YGLFkUcLxLSPBUcsPrZbeGFDYLydBmOSs6JFff_y3E5FLm7cFRlrQ4vSC2B4ISrvkGEkctVo6-W2dUogGGrwAJrZaSph2Ma4SIB_Avz_sAVmX22P9tJJiqfJYOSoYqafALVQgLlXblo-bcoEVhg" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="636" data-original-width="1507" height="270" src="https://blogger.googleusercontent.com/img/a/AVvXsEj6fWX_aa1KNF1T4l1FDSLISpVml-9NBLFvD0_YGLFkUcLxLSPBUcsPrZbeGFDYLydBmOSs6JFff_y3E5FLm7cFRlrQ4vSC2B4ISrvkGEkctVo6-W2dUogGGrwAJrZaSph2Ma4SIB_Avz_sAVmX22P9tJJiqfJYOSoYqafALVQgLlXblo-bcoEVhg=w640-h270" width="640" /></a></div>圖 7:存取陣列元素</div></span></div></div><div class="separator" style="clear: both; text-align: center;"><span style="color: #222222; font-size: medium; font-weight: 400;"><br /></span></div><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif"><span style="font-size: small;"><span style="color: #222222; font-weight: 400;">3.</span><span style="color: #222222;"> 08-03.在運算式中使用陣列元素</span><span style="font-weight: 400;"><span style="color: #222222;">:</span></span></span></span><span style="color: #222222; font-size: medium; font-weight: 400;">根據流程圖</span><span style="color: #222222; font-family: "Times New Roman"; font-size: medium; font-weight: 400; text-align: right;"><span><span><span style="color: black;">將 </span></span></span></span><span style="color: black; font-family: "Times New Roman"; font-size: medium; font-weight: 400; text-align: left;">Python 程式</span><span style="color: black; font-family: "Times New Roman"; font-size: medium; font-weight: 400; text-align: left;">轉換妥後</span><span style="color: black; font-family: "Times New Roman"; font-size: medium; font-weight: 400;">以「</span><span style="color: black; font-family: "Times New Roman"; font-size: medium; font-weight: 400; text-align: center;"><span style="white-space: pre-wrap;">08-03.在運算式中使用陣列元素.py」存檔執行</span></span><span style="color: black; font-family: "Times New Roman"; font-size: medium; font-weight: 400;">後就能看到</span><span style="color: black; font-family: "Times New Roman"; font-size: medium; font-weight: 400; text-align: left;">如圖 6</span><span style="color: black; font-family: "Times New Roman"; font-size: medium; font-weight: 400; text-align: left;"> 所對應的</span><span style="color: black; font-family: "Times New Roman"; font-size: medium; font-weight: 400;">執行結果。</span></div></h3><h3><div class="separator" style="clear: both; font-weight: 400; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><div class="separator" style="clear: both; font-size: medium;"><br /></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; font-size: medium;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEhMtticEu187j_gz3GeNWyT0zCX1Nk4t3QKDdgnCK5ClKCe57ixNuT_VHthtQgB1ipqym6DCRh1Jr3fB1kRFRCLO6mXzUPKOq1Yk_ecU4xoZ--lks01mk-WMw1LRYV-v7siSpHrfwk-3Mrg8iYtgoQAn1KRb3QKZU0a6_-rsKLa_SESadbaG6tiwQ" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="636" data-original-width="1380" height="294" src="https://blogger.googleusercontent.com/img/a/AVvXsEhMtticEu187j_gz3GeNWyT0zCX1Nk4t3QKDdgnCK5ClKCe57ixNuT_VHthtQgB1ipqym6DCRh1Jr3fB1kRFRCLO6mXzUPKOq1Yk_ecU4xoZ--lks01mk-WMw1LRYV-v7siSpHrfwk-3Mrg8iYtgoQAn1KRb3QKZU0a6_-rsKLa_SESadbaG6tiwQ=w640-h294" width="640" /></a></div></div><div class="separator" style="clear: both;"><span style="color: black; font-size: x-small;">圖 8:使用陣列來實現溫度度量單位轉換</span></div></div></div></span></div></h3></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="text-align: justify;"><span><a name='more'></a></span></div></div></div></div></div></span></div></div><div><div style="background-color: white;"><ol><li style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; margin: 0px 0px 0.25em; padding: 0px; text-align: justify;"><span style="font-size: x-small;"><a href="http://creativecommons.tw/explore" style="background-color: transparent; color: #2288bb; font-family: times, "times new roman", serif; text-decoration-line: none;" target="_blank">六種授權條款</a><span face="arial, tahoma, helvetica, freesans, sans-serif" style="background-color: transparent;">。</span></span></li><li style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; margin: 0px 0px 0.25em; padding: 0px; text-align: justify;"><span style="font-size: x-small;">Python 實作的陣列稱為<b>清單(list)</b>。</span></li></ol></div></div>Ted Leehttp://www.blogger.com/profile/03077454870590095355noreply@blogger.com0tag:blogger.com,1999:blog-1468347421357730785.post-15135718784907674932022-10-22T06:11:00.081+08:002022-10-23T09:15:35.296+08:00[micro:bit, digitalization] 自製影像(images)數位化(digitalization)的視覺化(visualization)教具<h1 style="text-align: center;"><span style="font-size: 21.3333px;">自製影像(images)數位化(digitalization)的視覺化(visualization)教具</span></h1><h1 style="text-align: center;"><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; font-weight: 400;"><a href="https://www.facebook.com/groups/134149180510967/" style="color: #2288bb; text-decoration-line: none;" target="_blank"><span style="font-family: times, "times new roman", serif;">Ted Lee的土饅頭(To Mentor)工坊</span></a></div><div style="font-size: medium; font-weight: 400;"><div><span style="color: #222222; font-family: times, "times new roman", serif; font-size: 13.2px;">Line:ted2016.kpvs</span><br /><span style="color: #222222; font-family: times, "times new roman", serif; font-size: 13.2px;">Email:Lct4246@gmail.com</span><br /><span style="color: #222222; font-family: times, "times new roman", serif;"><span style="font-family: "times new roman", serif;">FB</span>:</span><span style="font-family: times new roman, serif;"><a href="https://pse.is/TedLeeFB"><span style="color: #222222;">https://pse.is/</span><span style="color: #6aa84f;">TedLee</span><span style="color: red;">FB</span></a></span></div><div><span lang="" style="color: #222222; font-family: times, "times new roman", serif; font-size: 12pt;">Blog<span style="font-family: "times new roman"; font-size: small;">:</span></span><span style="font-family: times, times new roman, serif;"><a href="https://pse.is/TedLeeBlog" style="outline-width: 0px; user-select: auto;"><span style="color: #222222;">https://pse.is/</span><span style="color: #6aa84f;">TedLee</span><span style="color: red;">Blog</span></a></span></div><div><br /></div></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; font-weight: 400;"><span style="font-family: times, "times new roman", serif;">Oct. 22, 2022</span></div><div><span><span style="font-family: times, "times new roman", serif;"><span><div class="separator" style="clear: both; color: #222222; font-size: 13.2px; font-weight: 400;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s88/CC.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="31" data-original-width="88" height="31" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s1600/CC.png" width="88" /></a>[1]</div><div class="separator" style="clear: both; color: #222222; font-size: 13.2px; font-weight: 400;"><br /></div><div class="separator" style="clear: both; color: #222222; font-size: medium; font-weight: 400; text-align: justify;">108 課綱的國中端資訊科技科(<a href="https://reurl.cc/le3DG6" target="_blank">https://reurl.cc/le3DG6</a>)中明確規範了「數位化」這個主題的授課重點(圖 1)。</div><div class="separator" style="clear: both; color: #222222; font-size: medium; text-align: justify;"><span style="font-weight: 400;">在我們所處環境中存在著各種形式的</span>類比信號(analog signals)<span style="font-weight: 400;">。然而,隨著電腦技術的發達,計算速度愈來愈快、記憶容量愈來愈大,因而造成將這些信號轉換成易於傳輸、儲存,並使用電腦做處理的數位形式便更加重要了。</span></div><div class="separator" style="clear: both; color: #222222; font-size: medium; text-align: justify;"><span style="font-weight: 400;">本文將討論就</span>影像(image)<span style="font-weight: 400;">與</span>語音(speech)<span style="font-weight: 400;">兩種信號數位化的技術──</span>數位信號處理(Digital Signal Processing,DSP)<span style="font-weight: 400;">,我目前已開發出的 Excel 與</span>小彼特(micro:bit)<span style="font-weight: 400;">兩平台三種版本的視覺化</span><span style="font-weight: 400;">工具以做為拋磚引玉之期盼。註:因語音的處理技術與影像類似,本文僅選擇先以影像數位化之視覺工具為基礎,語音部份且容後文再述。</span></div><div class="separator" style="clear: both; color: #222222; font-size: medium; font-weight: 400; text-align: justify;"><br /></div><div class="separator" style="clear: both; color: #222222; font-weight: 400; text-align: justify;"><div class="separator" style="clear: both; font-size: medium; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjADDRexBp0KlxF8etga93qzqprrxeMcfaQjNdZoW8SYp2rZgI4IFoB4dhEi2RG2mOVdsQhjaauP2Ayyxg6w8kacEUog67InK3F1DZW8p2DtSnkwanv7Xdxrwv0vzup-UNsU_LszZDcDcoLW2FBzsWVjL1g8oYwu5jlWEQI0iWoVy1Qh0HYqoWKDg/s810/Snap1.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="770" data-original-width="810" height="608" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjADDRexBp0KlxF8etga93qzqprrxeMcfaQjNdZoW8SYp2rZgI4IFoB4dhEi2RG2mOVdsQhjaauP2Ayyxg6w8kacEUog67InK3F1DZW8p2DtSnkwanv7Xdxrwv0vzup-UNsU_LszZDcDcoLW2FBzsWVjL1g8oYwu5jlWEQI0iWoVy1Qh0HYqoWKDg/w640-h608/Snap1.png" width="640" /></a></div><div class="separator" style="clear: both; text-align: center;"><span style="color: black; font-family: "Times New Roman"; font-size: x-small;">圖 1:108 科技領綱中資訊科技科的學習內容包括「數位化」的概念</span></div></div><div class="separator" style="clear: both; color: #222222; font-size: medium; font-weight: 400; text-align: center;"><br /></div><div class="separator" style="clear: both; text-align: justify;"><div class="separator" style="clear: both;"><span style="font-size: small;"><span style="font-weight: normal;"><span style="color: #222222;">關於處理上述的兩種數位信號的方法很簡單,概念上就是</span><span style="color: red;">將之細切後再根據顆粒大小編碼</span>,也就是說,原影像切完的顆粒會變成最小的</span>像素<span style="font-family: "Times New Roman";">(pixel)</span><span style="font-weight: normal;">,再將每個像素的 RGB 值依大小編碼成二進值</span><span style="color: #222222; font-weight: normal;">。</span></span></div><div class="separator" style="clear: both; font-size: medium; font-weight: 700;"><span style="font-weight: normal;"><span style="color: #222222;"><br /></span></span></div><div class="separator" style="clear: both; color: #222222; font-size: medium;"><span style="font-weight: normal;">先</span>取樣(sampling)<span style="font-weight: normal;">:</span>分割(partitioning)<span style="font-weight: normal;"> 將圖 2 的愛心原始影像均等細切如圖 3,這個動作就好像在圖 2 上鋪上一層</span>方格紙(graph papaer)<span style="font-weight: normal;">,格點愈密,顆粒愈小,其數量也愈多。</span></div><div class="separator" style="clear: both; color: #222222; font-size: medium;"><span style="font-weight: normal;"><br /></span></div><div class="separator" style="clear: both;"><span style="color: #222222; font-size: medium; font-weight: normal;">再</span><span style="color: #222222; font-size: small;">量化(quantization)</span><span style="color: #222222; font-size: medium; font-weight: normal;">:</span><span style="color: #222222; font-size: medium;">編碼(encoding)</span><span style="color: #222222; font-size: medium; font-weight: normal;"> 針對圖 3 中每一格點顏色的 RGB 值 </span><span style="color: #222222; font-size: medium; font-weight: 400;">[2] </span><span style="color: #222222; font-size: medium; font-weight: normal;">轉換成對應的十進位值,例如:R = 127、G = 128、B = 129,圖 4)轉換成相對應的二進值(例如,</span><span style="font-weight: normal;"><span style="font-size: small;"><span lang="EN-US" style="color: #222222; font-family: Times, serif;">(127, 128, 129)<sub>2</sub> = </span><span lang="EN-US" style="color: #222222; font-family: Times, serif;">7F8081<sub>16</sub></span></span></span><span style="color: #222222; font-size: small;"><span style="font-weight: 400;">)。承前述,我們將圖 2 的所有格點以一位元的二進值轉換後如圖 5 所示。</span></span></div></div><div class="separator" style="clear: both; color: #222222; font-size: medium; font-weight: 400; text-align: center;"><br /></div><div class="separator" style="clear: both; color: #222222; font-weight: 400; text-align: center;"><div class="separator" style="clear: both; font-size: medium; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEiFLAlo58QE39uz2uHNelUubzz6LJGmYjEoYFue4n4QFSDa-xs_SoumefyTHHZ6UPdbNLUHWcH2xc2E7O5EcZCNfJKbh44EA3BplhWJwS4s31i5lwc4w_qEBWR_RgB6g2L07iyin2XhS17OaIqCag3nafzTIAdG9CJdX5sz-vZ-N4L835ZbXOC0RA" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="486" data-original-width="1540" height="126" src="https://blogger.googleusercontent.com/img/a/AVvXsEiFLAlo58QE39uz2uHNelUubzz6LJGmYjEoYFue4n4QFSDa-xs_SoumefyTHHZ6UPdbNLUHWcH2xc2E7O5EcZCNfJKbh44EA3BplhWJwS4s31i5lwc4w_qEBWR_RgB6g2L07iyin2XhS17OaIqCag3nafzTIAdG9CJdX5sz-vZ-N4L835ZbXOC0RA=w400-h126" width="400" /></a></div></div><div class="separator" style="clear: both; font-size: medium; text-align: center;"><span style="color: black; font-family: "Times New Roman"; font-size: small;">圖 2:原始影像</span></div><div class="separator" style="clear: both; font-size: medium; text-align: center;"><br /></div><div class="separator" style="clear: both; font-size: medium; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEhY9898rUK_dDRpFR3KhkV7eHm9gL3ah7_AEg9XOtpMnZa2VtYs9oIHiDCtsgK1wmQx3p8uLkgnZj265Fr5VCwGc1Eoq7lNWpkuNGjK7dP24RT0AM-Des9kNhidlOcI3PLUFwg7R-aBcuKl2I588iquqB8l-5fmVlfulYpkb66e8WpSM4S68OYJ3A" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="256" data-original-width="774" height="133" src="https://blogger.googleusercontent.com/img/a/AVvXsEhY9898rUK_dDRpFR3KhkV7eHm9gL3ah7_AEg9XOtpMnZa2VtYs9oIHiDCtsgK1wmQx3p8uLkgnZj265Fr5VCwGc1Eoq7lNWpkuNGjK7dP24RT0AM-Des9kNhidlOcI3PLUFwg7R-aBcuKl2I588iquqB8l-5fmVlfulYpkb66e8WpSM4S68OYJ3A=w400-h133" width="400" /></a></div><div class="separator" style="clear: both; text-align: center;"><span style="font-size: x-small;">圖 3:對影像取樣</span></div><div class="separator" style="clear: both; color: #222222; font-size: medium; font-weight: 400; text-align: center;"><br /></div><div class="separator" style="clear: both; color: #222222; font-size: medium; font-weight: 400; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEh_TQd7GVq17S8stnSjwKikecFJv-wjMGOfvP8M7FY4fcMeOTUUqoLcPoscB4t_g4s6z-DMiDrMreRVux_wYfCtBF7TLTq8523gJ-wlXteUymowz2dX-NYkfbXFpUrug4ZQIIGvy8XKQrcsxYWnfbn4qNlE5LL3WFHmJgZzjWCnafD69qJaMBbUKQ" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="453" data-original-width="375" height="400" src="https://blogger.googleusercontent.com/img/a/AVvXsEh_TQd7GVq17S8stnSjwKikecFJv-wjMGOfvP8M7FY4fcMeOTUUqoLcPoscB4t_g4s6z-DMiDrMreRVux_wYfCtBF7TLTq8523gJ-wlXteUymowz2dX-NYkfbXFpUrug4ZQIIGvy8XKQrcsxYWnfbn4qNlE5LL3WFHmJgZzjWCnafD69qJaMBbUKQ=w332-h400" width="332" /></a></div><span style="font-size: small;">圖 4:單一格點色彩的 RGB 值</span><br /><br /></div><div class="separator" style="clear: both; color: #222222; font-size: medium; font-weight: 400; text-align: center;"><div class="separator" style="clear: both; color: black; font-family: "Times New Roman";"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEhxRuefoJx1qEZEtVzXYIX5CvotRB4298ddiYWs-zefvKfNbVm0q5wiqFLWOvpYmB9hSQw0ceNS5sAq2N-rQ-iMuGxWxcDSLU473_qCVCe8syAVy7qchmzFTZ74AcEzDKMfyAXH-zA7T-3lJ7phcj11uBfAxyd_mn90AU3-sYWgfpIYHI-DhbkbRg" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="256" data-original-width="774" height="106" src="https://blogger.googleusercontent.com/img/a/AVvXsEhxRuefoJx1qEZEtVzXYIX5CvotRB4298ddiYWs-zefvKfNbVm0q5wiqFLWOvpYmB9hSQw0ceNS5sAq2N-rQ-iMuGxWxcDSLU473_qCVCe8syAVy7qchmzFTZ74AcEzDKMfyAXH-zA7T-3lJ7phcj11uBfAxyd_mn90AU3-sYWgfpIYHI-DhbkbRg" width="320" /></a></div><span style="color: black; font-family: "Times New Roman"; font-size: small;">圖 5:原始影像的量化二進值</span><br style="color: black; font-family: "Times New Roman";" /></div><div class="separator" style="clear: both; color: #222222; font-size: medium; font-weight: 400; text-align: center;"><span style="color: black; font-family: "Times New Roman"; font-size: small;"><br /></span></div></div></span></span></span></div></h1><h2>視覺教具 1(Excel BW 版)</h2><h1 style="text-align: center;"><p class="MsoQuote" style="text-align: justify;"><span style="font-size: small;"><span style="font-weight: 400;">首先,我們最期待的視覺工具是像 DOS 時代的闇黑工具 PCTools(<a href="https://reurl.cc/W1p0mD" target="_blank">https://reurl.cc/W1p0mD</a>)那般:修改影像的某塊</span><span style="font-weight: normal;">像素</span><span style="font-weight: 400;">值,螢幕上馬上讓狗狗的眼框帶出黑輪(</span><a href="https://reurl.cc/rRNEex" style="font-weight: 400;">https://reurl.cc/rRNEex</a><span style="font-weight: 400;">)。</span></span></p><p class="MsoQuote" style="font-weight: 400; text-align: justify;"><span style="font-size: small;">朝著這個目標前進,我們思考著用以下兩步驟來試試:</span></p><div style="text-align: justify;"><ol><li><span style="font-size: small;"><span style="font-weight: 400;">使用 Excel 的「內建函式」:如圖 6 所示,當上方 A1:E5 的 5×5 方陣(matrix)中的任何一格輸入 * 號時,在下方 A7:E11 方陣中所對應到的位置即顯示 1,表示上方此格被數化成 1(黑)。其中,下方方陣中的二進值 0(白)表示不包含在上方方陣的影像圖中。例如:當我們在上方陣的 B1 儲存格打上 * 時(已套用函式 =IF(B1 = "*",1,0),下方陣對應的 B7 儲存格立即顯示 1。</span></span></li><li><span style="font-size: small; font-weight: 400;">使用 Excel 的格化條件之「醒目提示」:如圖 7 所示,當下方陣任一儲存格中的值為 1 時(上方陣對應的儲存格已打入 *),使用圖 8 中「等於」的「醒目提示」功能替它上色。</span></li></ol></div><div style="font-weight: 400; text-align: justify;"><span style="font-size: small;">最後,設定完成後的 GIF 動畫如圖 9 所示。</span></div><div style="font-weight: 400; text-align: justify;"><span style="font-size: small;"><br /></span></div><p class="MsoQuote" style="font-weight: 400; text-align: center;"></p><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhD34X4uy2M5tlglMg0M9zliPdRAG2l0I2y1xoWY-mQULqEb1MhkDHp3oV88GPQWAJTmKlIPeykT3s7rF-DC5RdOMpqhB1ZjdGgoIB53Odu0L3DI3svYRcdxoFB9RmyMzqX9AqHkCxz8qyUd601wQHAspQHMGf36ITfNuG4hhej5McVo-hgBhq19w/s841/Snap3.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="662" data-original-width="841" height="504" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhD34X4uy2M5tlglMg0M9zliPdRAG2l0I2y1xoWY-mQULqEb1MhkDHp3oV88GPQWAJTmKlIPeykT3s7rF-DC5RdOMpqhB1ZjdGgoIB53Odu0L3DI3svYRcdxoFB9RmyMzqX9AqHkCxz8qyUd601wQHAspQHMGf36ITfNuG4hhej5McVo-hgBhq19w/w640-h504/Snap3.png" width="640" /></a></div><div><span style="font-weight: normal;"><span style="font-size: x-small;">圖 6:使用「函式」if()</span></span></div></h1><h1 style="text-align: center;"><div><br /></div><div><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVizVXZCI_FKjx9WLDjTW0tgjNOuG3N_Oq-M2_5iYafEya-kc8wfRyYip0QHkW-5LrYtWa1K0HxSUe5L5bRFYpGcV5q-HJI4zyID_E_jWKvibUlYOWoszDPYQncNCajdqXdrwnMhJAPi1yCwhCA9wUVabZJ6-NTy5MCrgWgjCtcIFEeGIvoVgQjQ/s1493/Snap3.png" style="margin-left: 1em; margin-right: 1em; outline-width: 0px !important; user-select: auto !important;"><img border="0" data-original-height="598" data-original-width="1493" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVizVXZCI_FKjx9WLDjTW0tgjNOuG3N_Oq-M2_5iYafEya-kc8wfRyYip0QHkW-5LrYtWa1K0HxSUe5L5bRFYpGcV5q-HJI4zyID_E_jWKvibUlYOWoszDPYQncNCajdqXdrwnMhJAPi1yCwhCA9wUVabZJ6-NTy5MCrgWgjCtcIFEeGIvoVgQjQ/s16000/Snap3.png" /></a></div><div class="separator" style="clear: both; text-align: center;"><span><span style="font-size: x-small; font-weight: 400;">圖 7:格式化條件之醒目提示</span></span></div><p></p><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLWlKxI_RlTL_qAR8nUm-iZqouo5yEIj3tMRovmsOhrrcNOr23SURwMOT4jZ90R74AW8T07JHexsRDFWZiPbYz346d9miRPMWxFOX40URgzlSVkEktzFMoMmCy2ZOxHALx_6mOpopC88OjjWoWW8NiGfBMHl1MqBXrv1NyXdAQM50Q0QudNdAR_w/s1279/Snap3.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="667" data-original-width="1279" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLWlKxI_RlTL_qAR8nUm-iZqouo5yEIj3tMRovmsOhrrcNOr23SURwMOT4jZ90R74AW8T07JHexsRDFWZiPbYz346d9miRPMWxFOX40URgzlSVkEktzFMoMmCy2ZOxHALx_6mOpopC88OjjWoWW8NiGfBMHl1MqBXrv1NyXdAQM50Q0QudNdAR_w/s16000/Snap3.png" /></a></div><div><span style="font-size: x-small; font-weight: normal;">圖 8:醒目提示條件設定</span></div></h1><h1 style="text-align: center;"><p class="MsoQuote" style="font-size: medium; font-weight: 400; text-align: center;"></p><div class="separator" style="clear: both; text-align: center;"><br /></div><p></p><p class="MsoQuote" style="font-size: medium; font-weight: 400; text-align: justify;">此「影像數位化的 Excel 視覺示例V2.xlsx」檔可從 <a href="https://reurl.cc/EROVeg">https://reurl.cc/EROVeg</a> 下載。</p><p class="MsoQuote" style="font-size: medium; font-weight: 400; text-align: justify;"><br /></p><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvSFiZCVYEV293rMiSZ3_g6TCV0Iy4aAZG_r0UcduPekIuk3eXmHojmG4gUnSU40qAagJ77uib4QU4rs4uInCZH9VojEgkASpo231rM4POavinlTli0hZj0pEwLdsY-89Rm1qDMA1pslLmu-xKAHUPjcW9GfdA6e1pBNEL8BF232WCkQuBS6SUAw/s778/%E5%BD%B1%E5%83%8F%E6%95%B8%E4%BD%8D%E5%8C%96%E7%9A%84%20Excel%20%E8%A6%96%E8%A6%BA%E7%A4%BA%E4%BE%8B_BW.gif" style="margin-left: 1em; margin-right: 1em; outline-width: 0px; user-select: auto;"><img border="0" data-original-height="568" data-original-width="778" height="234" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvSFiZCVYEV293rMiSZ3_g6TCV0Iy4aAZG_r0UcduPekIuk3eXmHojmG4gUnSU40qAagJ77uib4QU4rs4uInCZH9VojEgkASpo231rM4POavinlTli0hZj0pEwLdsY-89Rm1qDMA1pslLmu-xKAHUPjcW9GfdA6e1pBNEL8BF232WCkQuBS6SUAw/s320/%E5%BD%B1%E5%83%8F%E6%95%B8%E4%BD%8D%E5%8C%96%E7%9A%84%20Excel%20%E8%A6%96%E8%A6%BA%E7%A4%BA%E4%BE%8B_BW.gif" width="320" /></a></div><div class="separator" style="clear: both; font-weight: 400;"><span style="font-size: x-small;">圖 9:在上方的 5×5 方陣中作畫,下方隨即顯示此方陣圖數位化的二進值</span></div><div class="separator" style="clear: both; font-size: medium; font-weight: 400;"><span style="font-size: small;"><br /></span></div></h1><h2>視覺教具 2(Excel RGB 版)</h2><h1 style="text-align: center;"><p class="MsoQuote" style="font-size: medium; font-weight: 400; text-align: justify;"></p><p class="MsoQuote" style="font-size: medium; font-weight: 400; text-align: justify;">在教具 1 中,步驟 2 是以一個位元(0/1 兩種組合)來編碼每個格點。將之擴充成三位元(8 種組合)後,我們就可以將之擴充成本教具 2(動畫展示如圖 10 所示)。其中,為了簡化起見,我們將每一格點的色彩值限縮為 r/g/b 三值。</p><p class="MsoQuote" style="font-size: medium; font-weight: 400; text-align: justify;">此 .xlsx 檔可從 <a href="https://reurl.cc/EROVeg">https://reurl.cc/EROVeg</a> 下載。</p></h1><h1 style="text-align: center;"><div class="separator" style="clear: both; font-size: medium; font-weight: 400; text-align: justify;"></div><div class="separator" style="clear: both; font-size: medium; font-weight: 400; text-align: justify;"><br /></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxFRNT_FHzsHHe4fty4iq0xz8qsmUSoIQWWi6KMVLt1OoDMn32Hqg37tSaLAZowaJ0S4Vvlcag5DzX3EXHYpSl4g2oDl4NC26etAildTDVU05c0OGlu67xE22zPK5pp_C3y_CXJEQlNhHxdGUZ15zjsap7ibVdI4NkHbr5ly2vD454WclmtAFX0w/s1296/%E5%BD%B1%E5%83%8F%E6%95%B8%E4%BD%8D%E5%8C%96%E7%9A%84%20Excel%20%E8%A6%96%E8%A6%BA%E7%A4%BA%E4%BE%8B_RGB.gif" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="704" data-original-width="1296" height="347" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxFRNT_FHzsHHe4fty4iq0xz8qsmUSoIQWWi6KMVLt1OoDMn32Hqg37tSaLAZowaJ0S4Vvlcag5DzX3EXHYpSl4g2oDl4NC26etAildTDVU05c0OGlu67xE22zPK5pp_C3y_CXJEQlNhHxdGUZ15zjsap7ibVdI4NkHbr5ly2vD454WclmtAFX0w/w640-h347/%E5%BD%B1%E5%83%8F%E6%95%B8%E4%BD%8D%E5%8C%96%E7%9A%84%20Excel%20%E8%A6%96%E8%A6%BA%E7%A4%BA%E4%BE%8B_RGB.gif" width="640" /></a></div><div class="separator" style="clear: both; font-size: medium; font-weight: 400;"><span style="font-size: x-small;"><span style="mso-bookmark: _Ref111620918;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><span style="mso-no-proof: yes;">圖 10</span></span></span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">:以三位元編碼量化</span></span></div></h1><h2>視覺教具 3(小彼特版)</h2><h1 style="text-align: center;"><p style="font-size: medium; font-weight: 400; text-align: left;"></p></h1><h1 style="text-align: center;"><p class="MsoQuote" style="font-size: medium; font-weight: 400; text-align: justify;"></p><div style="text-align: justify;"><span style="font-size: small;">小彼特教育基金會(Micro:bit Educational Foundation)<span style="font-weight: normal;">(</span><span style="font-weight: 400;"><a href="https://microbit.org" target="_blank">https://microbit.org</a>)</span><span style="font-weight: 400;">日前在小彼特的開發平台 MakeCode 上發表了</span>資料日誌(Data Logger)<span style="font-weight: 400;">的一包新的</span>擴充積木(extension blocks)<span style="font-weight: 400;">(<a href="https://reurl.cc/XVv9nj" target="_blank">https://reurl.cc/XVv9nj</a>),如圖 11 所示。這個新增的功能是將板子所測得的數據直接寫成 </span></span><span style="font-size: medium; font-weight: 400;"><span style="color: red;">MY_DATA.htm </span></span><span style="font-size: medium; font-weight: 400;">網頁,並存在該小彼特的</span><span style="font-size: medium;">快閃記憶體(flash memory)</span><span style="font-size: medium; font-weight: 400;">中。</span></div><p class="MsoQuote" style="font-weight: 400; text-align: justify;"><span style="font-size: small;"><br /></span></p><p class="MsoQuote" style="font-weight: 400; text-align: center;"><span style="font-size: small;"></span></p><div class="separator" style="clear: both; text-align: center;"><span style="font-size: small;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjaQx53wmB26I6DJ1crAPZVo44HqRLc1RgIxoSgksnKoA0wDN974L56rjlxrYfneaMF48xEKXtcwObyX9eckvzNU5-HcGYyQRJ2-0CKvVQPc_j_Rbq-_6UnvOKj8egLX1mgYX3Hy2nBCJpMhDTC3NDoyyUsvWQB47vdq_vU7_q-Tee0JLaLuJQNDA" style="margin-left: 1em; margin-right: 1em; outline-width: 0px !important; user-select: auto !important;"><img alt="" data-original-height="721" data-original-width="684" height="640" src="https://blogger.googleusercontent.com/img/a/AVvXsEjaQx53wmB26I6DJ1crAPZVo44HqRLc1RgIxoSgksnKoA0wDN974L56rjlxrYfneaMF48xEKXtcwObyX9eckvzNU5-HcGYyQRJ2-0CKvVQPc_j_Rbq-_6UnvOKj8egLX1mgYX3Hy2nBCJpMhDTC3NDoyyUsvWQB47vdq_vU7_q-Tee0JLaLuJQNDA=w608-h640" width="608" /></a></span></div><div><span style="font-weight: normal;"><span style="font-size: small; mso-bookmark: _Ref111620918;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">圖 11</span></span><span face="標楷體" style="font-size: small; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">:資料日誌擴充積木</span></span></div><span style="font-size: small;"><br /></span><p></p><p class="MsoQuote" style="font-weight: 400; text-align: justify;"><span style="font-size: small;">利用這個新功能,我們設計了以下這個操作方式來輔助數位化的教學:</span></p><p class="MsoQuote" style="font-weight: 400; text-align: justify;"><span style="font-size: small;"></span></p><blockquote><span style="font-size: small;">按 A 左右移動,按 B 上下移動,按 A+B 畫點(並將此點記錄到資料日誌中)。</span></blockquote><p></p><p class="MsoQuote" style="font-size: medium; font-weight: 400; text-align: justify;">成果展示如圖 12 和 13 所示。</p><p class="MsoQuote" style="font-size: medium; font-weight: 400; text-align: justify;"><br /></p></h1><h1 style="text-align: center;"><p class="MsoListParagraph" style="background: white; font-size: medium; font-weight: 400; margin-left: 24pt; mso-list: l0 level1 lfo1; mso-para-margin-left: 0gd; text-indent: -24pt; text-justify: inter-ideograph;"></p><div class="separator" style="clear: both; font-weight: 400;"><div class="separator" style="clear: both; font-size: medium; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTvRNFvHTq79PwNi79Bp9QWbPefXPBeP-s7LKj3KhNHMixdsQAX91HrNhhSDIlJgQKQCcevFtF247yTOR52PhuHELVBXcKb9n3rBS4G30auY0Dk2fOhNWth7Auu_aRkBphBOLbqWw_Nea6ipf4K9wkdyFuOh7E858zJ16YHxClqPUlImEQ1WnCzQ/s1124/%E5%BD%B1%E5%83%8F%E6%95%B8%E4%BD%8D%E5%8C%96%E7%9A%84%E5%B0%8F%E5%BD%BC%E7%89%B9%E8%A6%96%E8%A6%BA%E7%A4%BA%E4%BE%8B_TedLee.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="1124" data-original-width="843" height="640" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTvRNFvHTq79PwNi79Bp9QWbPefXPBeP-s7LKj3KhNHMixdsQAX91HrNhhSDIlJgQKQCcevFtF247yTOR52PhuHELVBXcKb9n3rBS4G30auY0Dk2fOhNWth7Auu_aRkBphBOLbqWw_Nea6ipf4K9wkdyFuOh7E858zJ16YHxClqPUlImEQ1WnCzQ/w480-h640/%E5%BD%B1%E5%83%8F%E6%95%B8%E4%BD%8D%E5%8C%96%E7%9A%84%E5%B0%8F%E5%BD%BC%E7%89%B9%E8%A6%96%E8%A6%BA%E7%A4%BA%E4%BE%8B_TedLee.jpg" width="480" /></a></div><div class="separator" style="clear: both; text-align: center;"><span style="font-size: x-small;">圖 12:小彼特 + 資料日誌</span></div></div><div class="separator" style="clear: both; font-size: medium; font-weight: 400;"><span style="font-size: x-small;"><br /></span></div><div class="separator" style="clear: both; font-size: medium; font-weight: 400;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEje6rPuldDi8ebIfNaujPz8sWCr399LwXU2GqnbCSYBpq8zALvJ5NhttkbLsXZvRMMBfUYiY_kdOmSvwX-5XXhkrwxnXKPI36vWRXYByYqpHAdWkRlDVIRbKzoP_B-SkXDOnJCumcgijCUk5AcyWybzYd-7VQZ17xW3vo5_afxkxXr9tq7LRbU5OQ/s1911/%E5%BD%B1%E5%83%8F%E6%95%B8%E4%BD%8D%E5%8C%96%E7%9A%84%E5%B0%8F%E5%BD%BC%E7%89%B9%E8%A6%96%E8%A6%BA%E7%A4%BA%E4%BE%8B_TedLee.gif" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="924" data-original-width="1911" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEje6rPuldDi8ebIfNaujPz8sWCr399LwXU2GqnbCSYBpq8zALvJ5NhttkbLsXZvRMMBfUYiY_kdOmSvwX-5XXhkrwxnXKPI36vWRXYByYqpHAdWkRlDVIRbKzoP_B-SkXDOnJCumcgijCUk5AcyWybzYd-7VQZ17xW3vo5_afxkxXr9tq7LRbU5OQ/s16000/%E5%BD%B1%E5%83%8F%E6%95%B8%E4%BD%8D%E5%8C%96%E7%9A%84%E5%B0%8F%E5%BD%BC%E7%89%B9%E8%A6%96%E8%A6%BA%E7%A4%BA%E4%BE%8B_TedLee.gif" /></a></div></div><div class="separator" style="clear: both; font-weight: 400;"><span style="font-size: x-small;">圖 13:「小彼特 + 資料日誌」動畫展示</span></div></h1><div style="text-align: justify;"><br /></div><div style="text-align: justify;">和圖 3 類似,我們在資料日誌中建立相同的 5×5 影像表來記錄使用者在小彼特上繪製的圖案(圖 14)。詳細的積木程式請讀者們參考圖 15,<span style="text-align: left;">完整程式碼可由 </span><a href="https://lct4246.blogspot.com/2022/10/microbit-digitalization.html" style="text-align: left;" target="_blank">https://reurl.cc/4p2oZR</a><span style="text-align: left;"> 下載之。</span></div><div style="text-align: center;"><br /></div><div style="text-align: justify;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEiqg0_mVW9U7vY-hpKm-uUuGDxUhTSNlmhq4bdd371rcSCEPsc7E5g-kVlm-s-CWrNKZx6NLpt-Zmx5XFagmDtNDO85DsSOV18glSI0ZlTd1dy6QebK6ENp4uQQetO3EMklv8Jbdbf5I7SgwS5D-fgN1tsQ0oi0-Kc4sXM9YbnibgyV6dNu6mNC8w" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="309" data-original-width="806" height="154" src="https://blogger.googleusercontent.com/img/a/AVvXsEiqg0_mVW9U7vY-hpKm-uUuGDxUhTSNlmhq4bdd371rcSCEPsc7E5g-kVlm-s-CWrNKZx6NLpt-Zmx5XFagmDtNDO85DsSOV18glSI0ZlTd1dy6QebK6ENp4uQQetO3EMklv8Jbdbf5I7SgwS5D-fgN1tsQ0oi0-Kc4sXM9YbnibgyV6dNu6mNC8w=w400-h154" width="400" /></a></div><div style="text-align: center;"><span style="font-size: small;">圖 14:影像表格</span></div><br /><br /></div><div style="text-align: center;"><br /></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVSDu7IUP_VIulSszoyuoZxQwg_ds_-pCs4FuevJDb6FnQMJU3Cl6l280gULgt67jHe_uqAU9N3F0AlAw8akhS_04WUoxABDnOQk71njCFjLi0BCtrgHhGhqS6gzYX3pxJwVE8UU1fOO_b-lMVa9y_cUvqU5dRskbcGkj_XxIoAWYrLZUaUBuiqw/s2458/%E5%BD%B1%E5%83%8F%E6%95%B8%E4%BD%8D%E5%8C%96%E7%9A%84%E5%B0%8F%E5%BD%BC%E7%89%B9%E8%A6%96%E8%A6%BA%E7%A4%BA%E4%BE%8B_%E7%A8%8B%E5%BC%8F%E6%88%AA%E5%9C%96_TedLee.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="2458" data-original-width="762" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVSDu7IUP_VIulSszoyuoZxQwg_ds_-pCs4FuevJDb6FnQMJU3Cl6l280gULgt67jHe_uqAU9N3F0AlAw8akhS_04WUoxABDnOQk71njCFjLi0BCtrgHhGhqS6gzYX3pxJwVE8UU1fOO_b-lMVa9y_cUvqU5dRskbcGkj_XxIoAWYrLZUaUBuiqw/s16000/%E5%BD%B1%E5%83%8F%E6%95%B8%E4%BD%8D%E5%8C%96%E7%9A%84%E5%B0%8F%E5%BD%BC%E7%89%B9%E8%A6%96%E8%A6%BA%E7%A4%BA%E4%BE%8B_%E7%A8%8B%E5%BC%8F%E6%88%AA%E5%9C%96_TedLee.jpg" /></a></div><div style="text-align: center;"><span style="font-size: x-small;"><a name="_Ref111790651">圖</a><span style="mso-bookmark: _Ref111790651;"><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> </span></span><span><!--[if supportFields]><span
style='mso-bookmark:_Ref111790651'></span><span style='mso-element:field-begin'></span><span
style='mso-bookmark:_Ref111790651'><span lang=EN-US style='font-family:"Times New Roman",serif;
mso-fareast-font-family:標楷體'><span style='mso-spacerun:yes'> </span>SEQ </span></span><span
style='mso-bookmark:_Ref111790651'><span style='font-family:標楷體;mso-ascii-font-family:
"Times New Roman";mso-hansi-font-family:"Times New Roman";mso-bidi-font-family:
"Times New Roman"'>圖</span></span><span style='mso-bookmark:_Ref111790651'><span
lang=EN-US style='font-family:"Times New Roman",serif;mso-fareast-font-family:
標楷體'> \* ARABIC <span style='mso-element:field-separator'></span></span></span><![endif]--></span><span style="mso-bookmark: _Ref111790651;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">15</span></span><span><!--[if supportFields]><span
style='mso-bookmark:_Ref111790651'></span><span style='mso-element:field-end'></span><![endif]--></span><span style="mso-bookmark: _Ref111790651;"></span><span style="mso-bookmark: _Ref111790651;"></span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";"><span>:完整程式碼</span></span></span></div><h1 style="text-align: center;"><div style="font-size: medium; font-weight: 400; text-align: left;"><div class="separator" style="clear: both; text-align: center;"><br /></div></div></h1><h2>影像、聲音數位化學習單</h2><h1 style="text-align: center;"><p align="center" class="MsoNormal" style="background: white; break-after: avoid; font-size: medium; font-weight: 400; page-break-after: avoid;"><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"><span style="mso-spacerun: yes;"></span></span></p><div class="separator" style="clear: both; font-weight: 400;"><div style="font-size: medium; text-align: justify;"><span style="font-family: "Times New Roman", serif;">在還沒有發展出前述三種教具之前,筆者一直被</span><span style="font-family: "Times New Roman", serif;">翰</span><span style="font-family: "Times New Roman", serif;">林、康軒與南一三版本的</span><span style="font-family: "Times New Roman", serif;">國中資科九上的數位化內容僅做知識陳述所困擾,反覆思量著書本內講半天的理論,那到底我們拍好的美美照片轉成電腦能處理的二進值長的像怎樣?有沒有一種工具能讓我們改改、調調先去感受一下過程再來看理論知識呢?</span></div><div style="font-size: medium; text-align: justify;"><span style="font-family: Times New Roman, serif;">在此因緣際會下,圖 14 的這份學習單就從筆者的腦袋中蹦了出來了。</span></div><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"><span style="mso-spacerun: yes;"><div class="separator" style="clear: both; font-size: medium;"><br /></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both; font-size: medium;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiN4XYEagTGPkTkTSNpHTOL08irtdy1mwt3LaUrBoVzJ2XipF7mNNNQ1F95AXvPSU4hRap5ODlPNcCSBdg1gtjyTD3aH4gB_1fYa2iBveCfkq-EWXRAfFWeG5uFer8oU9rM-JPbNQHKXSmMx-SB1WnNK5weABp5pMYQ1uoZajHFzAH7OOsOjUK0Jg/s1053/%E5%BD%B1%E5%83%8F%E3%80%81%E8%81%B2%E9%9F%B3%E6%95%B8%E4%BD%8D%E5%8C%96%E5%AD%B8%E7%BF%92%E5%96%AE.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="1053" data-original-width="745" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiN4XYEagTGPkTkTSNpHTOL08irtdy1mwt3LaUrBoVzJ2XipF7mNNNQ1F95AXvPSU4hRap5ODlPNcCSBdg1gtjyTD3aH4gB_1fYa2iBveCfkq-EWXRAfFWeG5uFer8oU9rM-JPbNQHKXSmMx-SB1WnNK5weABp5pMYQ1uoZajHFzAH7OOsOjUK0Jg/s16000/%E5%BD%B1%E5%83%8F%E3%80%81%E8%81%B2%E9%9F%B3%E6%95%B8%E4%BD%8D%E5%8C%96%E5%AD%B8%E7%BF%92%E5%96%AE.jpg" /></a></div><div class="separator" style="clear: both;"><span style="font-size: x-small;"><a name="_Ref111790651"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">圖</span></a><span style="mso-bookmark: _Ref111790651;"><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> </span></span><!--[if supportFields]><span
style='mso-bookmark:_Ref111790651'></span><span style='mso-element:field-begin'></span><span
style='mso-bookmark:_Ref111790651'><span lang=EN-US style='font-family:"Times New Roman",serif;
mso-fareast-font-family:標楷體'><span style='mso-spacerun:yes'> </span>SEQ </span></span><span
style='mso-bookmark:_Ref111790651'><span style='font-family:標楷體;mso-ascii-font-family:
"Times New Roman";mso-hansi-font-family:"Times New Roman";mso-bidi-font-family:
"Times New Roman"'>圖</span></span><span style='mso-bookmark:_Ref111790651'><span
lang=EN-US style='font-family:"Times New Roman",serif;mso-fareast-font-family:
標楷體'> \* ARABIC <span style='mso-element:field-separator'></span></span></span><![endif]--><span style="mso-bookmark: _Ref111790651;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><span style="mso-no-proof: yes;">14</span></span></span><!--[if supportFields]><span
style='mso-bookmark:_Ref111790651'></span><span style='mso-element:field-end'></span><![endif]--><span style="mso-bookmark: _Ref111790651;"></span><span style="mso-bookmark: _Ref111790651;"></span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">:數位化學習單</span></span></div></div></span></span></div></h1><h1 style="text-align: center;"><div style="mso-element: footnote-list; text-align: left;"><hr align="left" size="1" style="font-size: medium; font-weight: 400;" width="33%" /><span style="font-size: small;"><!--[endif]--></span><div id="ftn1" style="mso-element: footnote;"><div style="font-weight: 400; text-align: justify;"><span style="font-size: x-small;">[1] <a href="http://creativecommons.tw/explore" style="color: #2288bb; font-family: times, "times new roman", serif; text-decoration-line: none;" target="_blank">六種授權條款</a><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;">。</span></span></div><div style="font-weight: 400; text-align: justify;"><span style="font-size: x-small;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;">[2] 光的三原色在八上理化的 4-5 光與顏色(<a href="https://reurl.cc/7p6WK1" target="_blank">https://reurl.cc/7p6WK1</a>)中會教授。</span></span></div></div></div></h1>Ted Leehttp://www.blogger.com/profile/03077454870590095355noreply@blogger.com0tag:blogger.com,1999:blog-1468347421357730785.post-30576887310297784572022-09-11T17:40:00.053+08:002022-10-09T10:33:39.855+08:00[fChart, Python] 以 fChart 馭 Python:函數(functions)(8/11)<h1 style="text-align: center;">以 fChart 馭 Python:<br />函數(functions)(8/11)</h1><div style="background-color: white; text-align: center;"><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><a href="https://www.facebook.com/groups/134149180510967/" style="color: #2288bb; text-decoration-line: none;" target="_blank"><span style="font-family: times, "times new roman", serif;">Ted Lee的土饅頭(To Mentor)工坊</span></a></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><div><span style="font-family: times, "times new roman", serif;">Line:ted2016.kpvs</span><br /><span style="font-family: times, "times new roman", serif;">Email:<a href="mailto:Lct4246@gmail.com" target="_blank">Lct4246@gmail.com</a></span><br /><span style="font-family: times, "times new roman", serif;"><span style="font-family: "times new roman", serif;">FB</span>:<a href="http://gg.gg/TedLeeFB/" target="_blank"><span style="font-family: "times new roman", serif;">http://gg.gg/</span><span style="color: #00cc00; font-family: "times new roman", serif;">TedLee</span><span style="color: red; font-family: "times new roman", serif;">FB</span><span style="font-family: "times new roman", serif;">/</span></a></span></div><div><span lang="" style="font-family: times, "times new roman", serif; font-size: 12pt;">Blog<span style="font-family: "times new roman"; font-size: small;">:</span><a href="http://gg.gg/TedLeeBlog/" target="_blank">http://gg.gg/<span style="color: #00cc00;">TedLee</span><span style="color: red;">Blog</span>/</a></span><br /></div></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><span style="font-family: times, "times new roman", serif;"><br /></span></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><span style="font-family: times, "times new roman", serif;">Sep. 11, 2022</span></div><div><span><span style="color: #222222; font-family: times, "times new roman", serif;"><span style="font-size: 13.2px;"><div class="separator" style="clear: both;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s88/CC.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="31" data-original-width="88" height="31" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s1600/CC.png" width="88" /></a>[1]</div></span></span><div class="separator" style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: left;"><br /></div><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify;"><span style="color: #222222;">接續著本 fChart 系列前文《<a href="https://lct4246.blogspot.com/2021/12/fchart-python-fchart.html" target="_blank">以 fChart 馭 Python:練 fChart 了沒?(1/11)</a>》(<a href="https://reurl.cc/oeDGN3">https://reurl.cc/oeDGN3</a>),我們將針對</span>圖1 的「10 大項目之 7」<span style="color: #222222;">的 6 個實例</span><span style="color: #222222; text-align: center; white-space: pre-wrap;">(可從<a href="https://reurl.cc/RXXDqr" target="_blank">https://reurl.cc/RXXDqr</a> </span><span style="color: #222222; text-align: center; white-space: pre-wrap;">下載)</span><span style="color: #222222;">,從</span></div><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;"><span></span><blockquote style="text-align: center;"><span></span><span></span><span></span><span></span><span></span><span></span><blockquote><span></span></blockquote></blockquote><blockquote><blockquote style="text-align: center;"><blockquote><span>原始問題描述</span><span>到</span><span>以流程圖表達解法</span><span>,</span></blockquote></blockquote><blockquote style="text-align: center;"><blockquote><span>再對照流程圖寫出 Python 語法程式</span></blockquote></blockquote></blockquote><blockquote style="text-align: center;"><blockquote><span></span></blockquote><span></span><blockquote><span></span></blockquote><span></span></blockquote><blockquote style="text-align: center;"><span></span></blockquote><blockquote style="text-align: center;"><span></span></blockquote><blockquote style="text-align: justify;"><span></span></blockquote><span></span></div><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify;"><span style="color: #222222;">的過程詳細說明整個</span><span style="color: #222222;">的</span><b><span style="color: #222222;">問題解決</span><span style="color: #222222; white-space: pre-wrap;">(problem solving)</span></b><span style="color: #222222;">過程。</span></div><div class="separator" style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;"><div class="separator" style="clear: both; text-align: center; white-space: pre-wrap;"><div class="separator"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; font-size: 13.2px;"><div class="separator" style="clear: both;"><br /></div></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; font-size: 13.2px;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEiwyZ25lBSGf3t4EL1fT1uoQSD4_RcjHubuogPRhOeXDNPAV_DnAkVP1hegyd4Z5fC6v5seYpiUD0q8O7wMGquEo3v46qAn2w57Vwu0QnkNo24jyb8qj6QABLukiEPwSWxa-YwuuoJ0IzU6vmrj2EcA9RsnShRo2e23cm6HvBgY8gtA0Ka6MM9qpQ" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="155" data-original-width="444" height="140" src="https://blogger.googleusercontent.com/img/a/AVvXsEiwyZ25lBSGf3t4EL1fT1uoQSD4_RcjHubuogPRhOeXDNPAV_DnAkVP1hegyd4Z5fC6v5seYpiUD0q8O7wMGquEo3v46qAn2w57Vwu0QnkNo24jyb8qj6QABLukiEPwSWxa-YwuuoJ0IzU6vmrj2EcA9RsnShRo2e23cm6HvBgY8gtA0Ka6MM9qpQ=w400-h140" width="400" /></a></div></div></div><div class="separator" style="clear: both;"><span style="font-size: x-small;">圖 1:10 大項目之 7</span></div></div></div></div></div></div></div></div></div><div class="separator" style="clear: both; text-align: center; white-space: pre-wrap;"><span><a name='more'></a></span></div></div><h2 style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;">在 fChart 中使用函數(functions)</h2><div style="text-align: justify;">我們以攝氏轉華氏的<a href="「溫度轉換」問題(https://reurl.cc/NR2xZx)">「溫度轉換」問題(https://reurl.cc/NR2xZx)</a>來說明如何在 fChart 中使用 [2] 函數。</div><div style="text-align: justify;">首先,我們先回顧未使用函數解溫度轉換問題的流程圖(圖 2),設定好參數值後直接代入公式計算。</div><div style="text-align: justify;"><br /></div><div style="text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEghsxlXUIBlNiaxuLVDCvh7cFTNIMWxb3Y54s3x8vuNPWByuahizF628C95gAGX6OtCqXpzf8b_oVux3W0qw9e_TmYVIdjA2zZ4i24hlXKY4DAdAsJcz1kMIDzpbUtPKWLmX-HwTC1RzEptEXiKqGMoARvWK7AmsYRKtVbUCyR4Re0uMpnoFxLFKQ" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="399" data-original-width="208" height="320" src="https://blogger.googleusercontent.com/img/a/AVvXsEghsxlXUIBlNiaxuLVDCvh7cFTNIMWxb3Y54s3x8vuNPWByuahizF628C95gAGX6OtCqXpzf8b_oVux3W0qw9e_TmYVIdjA2zZ4i24hlXKY4DAdAsJcz1kMIDzpbUtPKWLmX-HwTC1RzEptEXiKqGMoARvWK7AmsYRKtVbUCyR4Re0uMpnoFxLFKQ=w166-h320" width="166" /></a></div><span style="font-size: x-small;">圖 2:未使用函數解溫度轉換問題</span><br /><br /></div><div style="text-align: justify;">然後,我們再比較使用函數來解此問題的兩大步驟。在圖 3(a) 的<b>主程式(main program)</b>中(07-03.呼叫溫度轉換函數.fpp),直接用<a href="https://blogger.googleusercontent.com/img/a/AVvXsEjHIQVPRplx7_Bz5C1Pd6T6xoesZpNJfhheU3aRzffRBq8AUV-mgDzZt9HXlp9qaSU8tVSX1hX-pZzRy9Kyv4nVT5M7vwXXni5ocE8kJ30c9opoCyx_Y207MDHY1AE-QJhBWcPeTvdDnQ_UQFvJwIlLMGYBLWDRliibm4Pj10HQXgM3-IybbfoxgQ" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="58" data-original-width="232" height="50" src="https://blogger.googleusercontent.com/img/a/AVvXsEjHIQVPRplx7_Bz5C1Pd6T6xoesZpNJfhheU3aRzffRBq8AUV-mgDzZt9HXlp9qaSU8tVSX1hX-pZzRy9Kyv4nVT5M7vwXXni5ocE8kJ30c9opoCyx_Y207MDHY1AE-QJhBWcPeTvdDnQ_UQFvJwIlLMGYBLWDRliibm4Pj10HQXgM3-IybbfoxgQ=w200-h50" width="200" /></a>這個黑盒子把溫度轉換的方式包起來。所以,整個程式的邏輯就變的<b>精簡扼要(concise)</b>了:輸入要轉換的攝氏溫度值 C 給溫度轉換函數 c2f()(溫度轉換函數.fpp),圖 3(b) 。該函數會自動和圖 2 一樣,自動套用攝氏轉華氏的轉換公式。最後,將轉好的對應華氏溫度印出。</div><div style="text-align: justify;"><br /></div><div style="text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEiybr6rUnUrY_hC0FsYdlsSzGzNjOlYBta4Sc9kl89732jFXNRIo40nQihkiwnfDQwPekTGS4axtYRiT8TJr34W7V6K80aeM_9kPbNYoN-hjNKpYMVucirBwww6HO1UTIVR9ct0Y0LMLgJFMWqbZMERNP-gfupyIQFvG1qZwwO3jiE7u1UjJw4N6A" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="499" data-original-width="239" height="400" src="https://blogger.googleusercontent.com/img/a/AVvXsEiybr6rUnUrY_hC0FsYdlsSzGzNjOlYBta4Sc9kl89732jFXNRIo40nQihkiwnfDQwPekTGS4axtYRiT8TJr34W7V6K80aeM_9kPbNYoN-hjNKpYMVucirBwww6HO1UTIVR9ct0Y0LMLgJFMWqbZMERNP-gfupyIQFvG1qZwwO3jiE7u1UjJw4N6A=w192-h400" width="192" /></a></div><div class="separator" style="clear: both; text-align: center;"><span style="font-size: x-small;">(a) 函數</span><span style="font-size: small;">呼叫</span><span style="font-size: x-small;">(</span><span style="font-size: small;">主程式</span><span style="font-size: small;">)</span></div><div class="separator" style="clear: both; text-align: center;"> <div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjggfOSrdQzWtIaKieZlNq9_oaQ1v9i6uUWBPaBZTRH_9nVhDb0sDhI_4Sq3QYG_ApHbrOE2n6f6OebZLNIUD0iVWlfu76HLQoZ68HKw3wFM-lJOwmsXAJwJJZxfF2GYzB59DieA30nRD-zeJFhCt9rvMPROQW9CLD7l88U38r7QhXnaeFqHxpTvQ" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="325" data-original-width="422" height="246" src="https://blogger.googleusercontent.com/img/a/AVvXsEjggfOSrdQzWtIaKieZlNq9_oaQ1v9i6uUWBPaBZTRH_9nVhDb0sDhI_4Sq3QYG_ApHbrOE2n6f6OebZLNIUD0iVWlfu76HLQoZ68HKw3wFM-lJOwmsXAJwJJZxfF2GYzB59DieA30nRD-zeJFhCt9rvMPROQW9CLD7l88U38r7QhXnaeFqHxpTvQ=w320-h246" width="320" /></a></div><span style="font-size: x-small;">(b) 函數</span><span style="font-size: small;">定義</span><span style="font-size: small;"> c2f()</span></div><div class="separator" style="clear: both; text-align: center;"><span style="font-size: x-small;">圖 3:使用函數解溫度轉換問題</span></div><br /><div style="text-align: justify;"><br /></div><div style="text-align: justify;">圖 3(a) 對應的 Python 函數呼叫語法為:</div><div style="text-align: justify;"><blockquote><span style="color: red;">c2f(</span>參數<span style="color: red;">)</span></blockquote></div><div style="text-align: justify;">另一方面,圖 3(b) 對應的 Python 函數定義語法如下。讀者們要特別留意,第二行的 F... 和 第三行的 r... 均要按四個<b>空白鍵(space)</b>和第一行的 c... 對齊。這個方式稱為<b>縮排(identation)</b>,表示 : 後以下各行的指令是包在 c2f() 中而形一個函數定義的獨立<b>區塊(blocks)</b>。此外,# 符號後頭的文字皆為<b>程式註解(comments)</b>,不用輸入。</div><div style="text-align: justify;"><div></div><blockquote><div><span style="color: red;">def</span> c2f(參數)<span style="color: red;">:</span> #自訂函數 c2f() </div><div> F = 溫度轉換公式計算</div><div> return F #傳回轉換後的溫度值</div></blockquote><div></div></div><div style="text-align: justify;">註:函數的 fChart 流程圖繪製方式請有興趣的讀者們自行觀看陳會安老師錄製的<a href="https://www.youtube.com/watch?v=T4AJAZjJwzk" target="_blank">這段影片(https://reurl.cc/2maQrX)</a>。</div></div><span><!--more--></span><h2 style="text-align: justify;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; text-align: left;">原始問題</span></h2><div class="separator" style="clear: both; text-align: left;"><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify; white-space: pre-wrap;"><div class="separator" style="clear: both; white-space: normal;"><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="color: #222222;">我們試圖把會安老師編排的範例一一還原到初始的問題形式來帶領讀者們思考:</span></div><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="color: #222222;"><br /></span></div><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="color: #2b00fe;"></span><blockquote><span style="color: #2b00fe;">問題</span><span style="color: #222222;"> --- </span><span style="color: red;">流程圖</span><span style="color: #222222;"> ---> </span><span style="color: #2b00fe;">解法</span></blockquote><span style="color: #2b00fe;"></span></div><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="color: #222222;"><br /></span></div><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="color: #222222;">一連串的</span><span style="color: #222222;">問題解決</span><span style="color: #222222;">奇幻之旅。筆者再次強調,</span></div><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="color: #222222;"><br /></span></div><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="color: #222222;"><blockquote>「解決問題」是編程訓練的終極目的,而「流程圖」乃為邏輯表達之母(積木拼圖湊答案不是)。</blockquote></span></div></div></div><span style="color: #222222;"><h4></h4></span><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; text-align: justify;"><div class="separator" style="clear: both; text-align: left;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; text-align: justify;"><span style="color: black;">1. <b>03.呼叫溫度轉換函數</b>:將攝氏溫度轉換成對應的華氏溫度<a href="https://blogger.googleusercontent.com/img/a/AVvXsEjgwmoQoojcMxphksDRySnL63VtV_EVltXuRoHnKupMgBGve7T_-9XJHJx7oH5ZTMyLJC6aSkElB1rhXwdO38MDyZqZ0R1CJhURZclqONMqP28XIcb-eRIAINBzfTlu2cYloeDP0Pm5S-m35dhvsEjlz-vEzvh23FIiJwPLydH6FieCkGvc8ZVTpg" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="85" data-original-width="188" height="91" src="https://blogger.googleusercontent.com/img/a/AVvXsEjgwmoQoojcMxphksDRySnL63VtV_EVltXuRoHnKupMgBGve7T_-9XJHJx7oH5ZTMyLJC6aSkElB1rhXwdO38MDyZqZ0R1CJhURZclqONMqP28XIcb-eRIAINBzfTlu2cYloeDP0Pm5S-m35dhvsEjlz-vEzvh23FIiJwPLydH6FieCkGvc8ZVTpg=w200-h91" width="200" /></a></span><span style="color: black;">。</span><span style="color: black;">註:「溫標」</span><span style="color: black;">的概念在 108 新課綱是排在國中理化階段教授(</span><a href="https://www.k12ea.gov.tw/files/class_schema/%E8%AA%B2%E7%B6%B1/17-%E8%87%AA%E7%84%B6%E7%A7%91%E5%AD%B8/17-1/%E5%8D%81%E4%BA%8C%E5%B9%B4%E5%9C%8B%E6%B0%91%E5%9F%BA%E6%9C%AC%E6%95%99%E8%82%B2%E8%AA%B2%E7%A8%8B%E7%B6%B1%E8%A6%81%E5%9C%8B%E6%B0%91%E4%B8%AD%E5%B0%8F%E5%AD%B8%E6%9A%A8%E6%99%AE%E9%80%9A%E5%9E%8B%E9%AB%98%E7%B4%9A%E4%B8%AD%E7%AD%89%E5%AD%B8%E6%A0%A1%E2%94%80%E8%87%AA%E7%84%B6%E7%A7%91%E5%AD%B8%E9%A0%98%E5%9F%9F.pdf" style="outline-width: 0px; user-select: auto;" target="_blank">https://reurl.cc/O46Ovr</a><span style="color: black;">) 。</span></span></div>2. <b>07-01.呼叫Triangle</b>:印出一數字排列的直角三角形<a href="https://blogger.googleusercontent.com/img/a/AVvXsEjcz63CECXrKkU3VjX0WBO8eSj9DDaTZCULhkW2x55ENHVGteq7xWpko0Kug2GNE7WEokNE0l-fiTMnYpwU4RuCX76z-ITvK9PWGhTUBcN9nLO46U4NdGc8mg0ZdaUM-9eOgEDkoeyD9kgMoOoexFGLA1plcb0TxyIvEkCBIRKvyqOcWb50iKUSYg" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="229" data-original-width="152" height="200" src="https://blogger.googleusercontent.com/img/a/AVvXsEjcz63CECXrKkU3VjX0WBO8eSj9DDaTZCULhkW2x55ENHVGteq7xWpko0Kug2GNE7WEokNE0l-fiTMnYpwU4RuCX76z-ITvK9PWGhTUBcN9nLO46U4NdGc8mg0ZdaUM-9eOgEDkoeyD9kgMoOoexFGLA1plcb0TxyIvEkCBIRKvyqOcWb50iKUSYg=w133-h200" width="133" /></a></span><span style="text-align: justify;">。</span></div><div class="separator" style="clear: both; text-align: left;"><span style="text-align: justify;">3. <b>07-02.呼叫BMI函數</b>:計算 <a href="https://en.wikipedia.org/wiki/Body_mass_index" target="_blank">BMI 指數(https://reurl.cc/KQEO9M)</a> 健康指數</span><a href="https://blogger.googleusercontent.com/img/a/AVvXsEhbWmrLvwqbYQ6gAwvjP-JhuROqceXbQDobgaNZ8ZPH8MBgNuDV10qcKfq0JHdLMUTXPfoZuEIkTaUfCrjTCkgvWWYEFM7lzrg9u6l_ZI2LQJkd3EGhHS95BN30o3GPeyyCu-22JWccVSSren9wYmUAesnh-sZ9lGp5qcaA_ugIuU2M1wDUlV-nIg" style="margin-left: 1em; margin-right: 1em; text-align: justify;"><img alt="" data-original-height="104" data-original-width="195" height="107" src="https://blogger.googleusercontent.com/img/a/AVvXsEhbWmrLvwqbYQ6gAwvjP-JhuROqceXbQDobgaNZ8ZPH8MBgNuDV10qcKfq0JHdLMUTXPfoZuEIkTaUfCrjTCkgvWWYEFM7lzrg9u6l_ZI2LQJkd3EGhHS95BN30o3GPeyyCu-22JWccVSSren9wYmUAesnh-sZ9lGp5qcaA_ugIuU2M1wDUlV-nIg=w200-h107" width="200" /></a><span style="text-align: justify;">。</span></div><div class="separator" style="clear: both; text-align: left;"><span style="text-align: justify;">4. <b>07-04.呼叫階層函數Factorial</b>:計算 <span style="color: #2b00fe;">n! = 1 × 2</span></span><span style="color: #2b00fe;"><span style="text-align: justify;"> </span><span style="text-align: justify;">× 3</span><span style="text-align: justify;"> </span><span style="text-align: justify;">× ... </span><span style="text-align: justify;"> </span><span style="text-align: justify;">× (n-1)</span></span><span style="text-align: justify;"><span style="color: #2b00fe;"> × n</span> 的結果</span><span style="text-align: justify;">(整數連乘積)</span><span style="text-align: justify;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEhZm18NjgtUjRD1lHqYDa04hVHHlP3-SnX0ztBtZ3QIp0ZU69nWnBIe4ixBl-CyKuLZWkE4-1sA-UXOAesi20LO-aYnXMr0hM8LL4xgQMXb5cEV3dDfyZPVawkWw1eqG0m4zkk8bGCIkaFEEaFrVlRHSmjB4pr1ROWs5W6_f7masnwi7r6DbBZJkg" style="margin-left: 1em; margin-right: 1em; text-align: center;"><img alt="" data-original-height="85" data-original-width="192" height="89" src="https://blogger.googleusercontent.com/img/a/AVvXsEhZm18NjgtUjRD1lHqYDa04hVHHlP3-SnX0ztBtZ3QIp0ZU69nWnBIe4ixBl-CyKuLZWkE4-1sA-UXOAesi20LO-aYnXMr0hM8LL4xgQMXb5cEV3dDfyZPVawkWw1eqG0m4zkk8bGCIkaFEEaFrVlRHSmjB4pr1ROWs5W6_f7masnwi7r6DbBZJkg=w200-h89" width="200" /></a></span><span style="text-align: justify;">。</span></div><div class="separator" style="clear: both; text-align: left;"><span style="text-align: justify;"><span>5. <b>07-05.呼叫printMsg和sum2Ten函數</b>:定義一個訊息輸出與連續累加求和函數</span></span><span style="text-align: justify;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEgvNzHD71xvCOdRp_gBSX6f1vxESmAG2FMmi2B8f4K8qZtGx2KICM2XLBK-Y8145skwcy75BjW8ySTcIjgt6R5rLuRejcd_uB2zfJFb2ArXABiQ9kOrkUiFoR3xD80HOIU0h3FC9WV156HNfhn_5juXSz-SC3HwEMhT-mHDCRpELZj-pYZgeDNeNw" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="85" data-original-width="176" height="97" src="https://blogger.googleusercontent.com/img/a/AVvXsEgvNzHD71xvCOdRp_gBSX6f1vxESmAG2FMmi2B8f4K8qZtGx2KICM2XLBK-Y8145skwcy75BjW8ySTcIjgt6R5rLuRejcd_uB2zfJFb2ArXABiQ9kOrkUiFoR3xD80HOIU0h3FC9WV156HNfhn_5juXSz-SC3HwEMhT-mHDCRpELZj-pYZgeDNeNw=w200-h97" width="200" /></a></span><span style="text-align: justify;"><span>。</span></span></div><div class="separator" style="clear: both; text-align: left;"><span style="text-align: justify;">6. <b>07-06.呼叫和顯示BMI值</b>:承 2 和 5,留給讀者們自行練習</span><span style="text-align: justify;">。</span></div><div class="separator" style="clear: both; text-align: left;"><div class="separator" style="clear: both;"><span style="text-align: justify;"><div class="separator" style="clear: both; text-align: left;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; text-align: justify;"><div class="separator" style="clear: both; font-weight: bold; text-align: left;"><span><!--more--></span></div><div class="separator" style="clear: both; font-weight: bold; text-align: left;"><h2 style="clear: both;"></h2></div></span></div><div class="separator" style="clear: both; text-align: left;"><h2 style="clear: both; text-align: justify;"><span style="color: #222222; text-align: left;">流程圖與 Python 語法對轉</span></h2></div></span></div></div><div class="separator" style="clear: both; text-align: left;"><div class="separator" style="clear: both;"><div style="text-align: justify;"><h3><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span><span style="font-weight: 400;">1.</span><span><span style="font-weight: 400;"> </span>07-</span></span>03.呼叫溫度轉換函數<span style="font-weight: 400;">:如前述,</span></span></span><span style="font-size: small;"><span style="color: #222222; font-weight: 400; text-align: right;"><span><span><span style="color: black;">將 </span></span></span></span><span style="color: black; font-weight: 400; text-align: left;">Python 程式</span><span style="color: black; font-weight: 400; text-align: left;">轉換妥後</span><span style="color: black; font-weight: 400;">以「</span><span style="color: black; text-align: center;"><span><span style="font-weight: 400; white-space: pre-wrap;">07-03.呼叫溫度轉換函數.py」存檔執行</span></span></span><span style="color: black; font-weight: 400;">後就能看到</span><span style="color: black; font-weight: 400; text-align: left;">如圖 4</span><span style="color: black; font-weight: 400; text-align: left;"> 所對應的</span><span style="color: black; font-weight: 400;">執行結果。</span></span></div><div class="separator" style="clear: both;"><span style="font-size: small;"><span style="color: black; font-weight: 400;"><br /></span></span></div></h3><h3><div class="separator" style="clear: both; font-size: medium; font-weight: 400;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="color: black; font-size: small;"><div></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="text-align: justify;"><span></span></div></div></div></span></span></div></h3><h3><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span style="font-weight: 400;"></span></span></span></div><div class="separator" style="clear: both; font-weight: 400; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><div class="separator" style="clear: both; font-size: medium;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEi41ZWuaLPs1PtRPNCNvCL4ucNNKEJvIHPCxmNp7X_GFxC_2M9BfbD-9M0oFn0_qdflJKd_IU665OmMc3tFSa4OzgxDvG7azAvHZLIyHnXCbG5i_1jYtqMHshvl-DDN8iB3VFi4PggJGNRt5_qddBVazMuHlDxgfZ7P2SRHdYqOdao7f0ZDt95LkA" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="739" data-original-width="1796" src="https://blogger.googleusercontent.com/img/a/AVvXsEi41ZWuaLPs1PtRPNCNvCL4ucNNKEJvIHPCxmNp7X_GFxC_2M9BfbD-9M0oFn0_qdflJKd_IU665OmMc3tFSa4OzgxDvG7azAvHZLIyHnXCbG5i_1jYtqMHshvl-DDN8iB3VFi4PggJGNRt5_qddBVazMuHlDxgfZ7P2SRHdYqOdao7f0ZDt95LkA=s16000" /></a></div></div><div class="separator" style="clear: both;"><span style="font-size: x-small;"><span style="color: black;">圖 4:</span><span style="color: black;">溫度轉換函數</span></span></div></span></div></h3><h3><div class="separator" style="clear: both;"><span style="color: #222222; font-size: small;"><span style="color: #222222;"><span style="font-weight: 400;">2. </span>07-</span><span style="color: black; font-weight: 400;"><span style="color: #222222;"><b>01.呼叫Triangle</b>:請讀者們自行和 <a href="https://reurl.cc/kE98kn" target="_blank">https://reurl.cc/kE98kn</a> 的未函數化版本對照。</span></span></span></div><div class="separator" style="clear: both;"><span style="color: #222222; font-size: medium; font-weight: 400; text-align: right;"><span><span><span style="color: black;">將 </span></span></span></span><span style="color: black; font-size: medium; font-weight: 400; text-align: left;">Python 程式</span><span style="color: black; font-size: medium; font-weight: 400; text-align: left;">轉換妥後</span><span style="color: black; font-size: medium; font-weight: 400;">以「</span><span style="color: black; font-size: medium; text-align: center;"><span><span style="font-weight: 400; white-space: pre-wrap;">07-01.呼叫Triangle.py」存檔執行</span></span></span><span style="color: black; font-size: medium; font-weight: 400;">後就能看到</span><span style="color: black; font-size: medium; font-weight: 400; text-align: left;">如圖 5</span><span style="color: black; font-size: medium; font-weight: 400; text-align: left;"> 所對應的</span><span style="color: black; font-size: medium; font-weight: 400;">執行結果。</span></div><div class="separator" style="clear: both;"><span style="color: #222222; font-size: medium; font-weight: 400;"><div class="separator" style="clear: both; text-align: center;"></div></span><div style="text-align: center;"><span style="font-size: x-small; font-weight: 400;"><br /><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEhhzkujY0yC9Cl8-05tdw20-4ca2GjjvJqpYm7eA-PYNFRsqUrdBw5gwGmaBX4uHdVfJUVxbaGUNFCuiBFfEanUfY5kv3S4INo7-ON-tJvO_dHPVt_MY0w8n25A4C8FISXfBKR2MELnAGfBF5MaxpnD1dBc2AoRTznCWoR0TOMWobl8659j0mXJEQ" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="749" data-original-width="1282" height="374" src="https://blogger.googleusercontent.com/img/a/AVvXsEhhzkujY0yC9Cl8-05tdw20-4ca2GjjvJqpYm7eA-PYNFRsqUrdBw5gwGmaBX4uHdVfJUVxbaGUNFCuiBFfEanUfY5kv3S4INo7-ON-tJvO_dHPVt_MY0w8n25A4C8FISXfBKR2MELnAGfBF5MaxpnD1dBc2AoRTznCWoR0TOMWobl8659j0mXJEQ=w640-h374" width="640" /></a></div></span></div></div><div class="separator" style="clear: both; text-align: center;"><span style="color: #222222; font-size: medium; font-weight: 400;"><span style="color: black; font-size: small;">圖 5:數字直角三角形排列函數</span></span></div><div class="separator" style="clear: both; text-align: center;"><span style="color: #222222; font-size: medium; font-weight: 400;"><br /></span></div><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif"><span style="font-size: small;"><span style="color: #222222; font-weight: 400;">3.</span><span style="color: #222222;"> 07-</span><span style="color: #222222;">02.呼叫BMI函數</span><span style="font-weight: 400;"><span style="color: #222222;">:請讀者們自行和 <a href="https://makerpro.cc/2022/04/use-fchart-to-learn-python-part-three/" target="_blank">https://reurl.cc/kE98kn</a> 的未函數化版本對照。</span></span></span></span></div><div class="separator" style="clear: both;"><span style="color: #222222; font-family: "Times New Roman"; font-size: medium; font-weight: 400; text-align: right;"><span><span><span style="color: black;">將 </span></span></span></span><span style="color: black; font-family: "Times New Roman"; font-size: medium; font-weight: 400; text-align: left;">Python 程式</span><span style="color: black; font-family: "Times New Roman"; font-size: medium; font-weight: 400; text-align: left;">轉換妥後</span><span style="color: black; font-family: "Times New Roman"; font-size: medium; font-weight: 400;">以「</span><span style="color: black; font-family: "Times New Roman"; font-size: medium; font-weight: 400; text-align: center;"><span style="white-space: pre-wrap;">07-02.呼叫BMI函數.py」存檔執行</span></span><span style="color: black; font-family: "Times New Roman"; font-size: medium; font-weight: 400;">後就能看到</span><span style="color: black; font-family: "Times New Roman"; font-size: medium; font-weight: 400; text-align: left;">如圖 6</span><span style="color: black; font-family: "Times New Roman"; font-size: medium; font-weight: 400; text-align: left;"> 所對應的</span><span style="color: black; font-family: "Times New Roman"; font-size: medium; font-weight: 400;">執行結果。</span></div></h3><h3><div class="separator" style="clear: both; font-weight: 400; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><div class="separator" style="clear: both; font-size: medium;"><br /></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; font-size: medium; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4gfrMDpfXN7hOybAxlXT1biBNiR0jD1WmcErqZAmZVQDRi-hb9oQox4Q9r6r52th9JOqEBmcj0HkY4L58w4Twk3OkBSoq81MRAEEDagb9NRuDe2DNfP8sLlrYoQtc0r2ASuJSLTRlQr_QoyPyak3Qbz8t1EHTpY2aTUm9oIXnbtE4PEB6K8cLwQ/s1813/Snap2.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="743" data-original-width="1813" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4gfrMDpfXN7hOybAxlXT1biBNiR0jD1WmcErqZAmZVQDRi-hb9oQox4Q9r6r52th9JOqEBmcj0HkY4L58w4Twk3OkBSoq81MRAEEDagb9NRuDe2DNfP8sLlrYoQtc0r2ASuJSLTRlQr_QoyPyak3Qbz8t1EHTpY2aTUm9oIXnbtE4PEB6K8cLwQ/s16000/Snap2.jpg" /></a></div><div class="separator" style="clear: both;"><span style="color: black; font-size: x-small;">圖 6:BMI 計算函數</span></div></div></div></span></div><div class="separator" style="clear: both; font-size: medium; font-weight: 400; text-align: center;"><br /></div></h3><h3><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span style="font-weight: 400;">4. </span>07-04.呼叫階層函數Factorial<span style="font-weight: 400;">:和累加求和的概念相同,從下列推理過程我們可輕鬆的規納出只要使用一個固定數的迴圈,再建立一個乘積累計變數去累計歷次的乘積結果即為所求。</span></span></span></div><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span style="font-weight: 400;"><br /></span></span></span></div><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span style="font-weight: 400;">1! = 1</span></span></span></div><div class="separator" style="clear: both;"><span style="color: red;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif"><span style="font-size: small;"><span style="font-weight: 400;">2! = 1 × 2 = 1! </span></span></span><span style="font-size: small;">×<span style="font-weight: normal;"> 2</span> </span></span></div><div class="separator" style="clear: both;"><span style="font-size: small;"><span style="color: #222222;"><span style="font-weight: 400;">3! = 1 × 2</span></span> × <span style="font-weight: normal;">3= <span style="color: red;">2!</span> × 3</span></span></div><div class="separator" style="clear: both;"><span style="font-weight: normal;"><span style="font-size: small;">…</span></span></div><div class="separator" style="clear: both;"><span style="font-weight: normal;">n! = (n-1)! × n</span></div><div class="separator" style="clear: both;"><span style="font-size: small;"><span style="font-weight: normal;"><br /></span></span></div><div class="separator" style="clear: both;"><span style="font-size: small;"><span style="color: #222222; font-weight: 400; text-align: right;"><span><span><span style="color: black;">將 </span></span></span></span><span style="color: black; font-weight: 400; text-align: left;">Python 程式</span><span style="color: black; font-weight: 400; text-align: left;">轉換妥後</span><span style="color: black; font-weight: 400;">以「</span><span style="color: black; text-align: center;"><span><span style="font-weight: 400; white-space: pre-wrap;">07-04.呼叫階層函數Factorial.py」存檔執行</span></span></span><span style="color: black; font-weight: 400;">後就能看到</span><span style="color: black; font-weight: 400; text-align: left;">如圖 7</span><span style="color: black; font-weight: 400; text-align: left;"> 所對應的</span><span style="color: black; font-weight: 400;">執行結果。</span></span></div></h3><h3><div class="separator" style="clear: both; font-size: medium; font-weight: 400;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="color: black; font-size: small;"><div></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="text-align: justify;"><span></span></div></div></div></span></span></div></h3><h3><div class="separator" style="clear: both; font-size: medium; font-weight: 400; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><div class="separator" style="clear: both; text-align: justify;"></div></span></div></h3><h3><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span style="font-weight: 400;"></span></span></span></div><div class="separator" style="clear: both; font-weight: 400; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><div class="separator" style="clear: both; font-size: medium;"><br /></div><div class="separator" style="clear: both; font-size: medium;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEg15OyaxM9IfnqMc7YDWLvVETGQLSdlkiiyTufG5AkOqGgRMj02z9m8u984asdeFjtFYH8-AI2Fwn8fwmNhEWUBRVc1hKTiqhyyD_wdWbMmaDjzRLLNMY1ZYEXmAswkKigOrGvetchFoZgsnoJgWaik83V-pbhFJ4-PzFnIFjPjf43c3iNpevP_Qw" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="643" data-original-width="1784" src="https://blogger.googleusercontent.com/img/a/AVvXsEg15OyaxM9IfnqMc7YDWLvVETGQLSdlkiiyTufG5AkOqGgRMj02z9m8u984asdeFjtFYH8-AI2Fwn8fwmNhEWUBRVc1hKTiqhyyD_wdWbMmaDjzRLLNMY1ZYEXmAswkKigOrGvetchFoZgsnoJgWaik83V-pbhFJ4-PzFnIFjPjf43c3iNpevP_Qw=s16000" /></a></div></div><div class="separator" style="clear: both;"><span style="font-size: x-small;"><span style="color: black;">圖 7:</span><span style="color: black;">階層計算函數</span></span></div><div class="separator" style="clear: both; font-size: medium;"><span style="color: black; font-size: small;"></span></div></span></div></h3><h3><div class="separator" style="clear: both;"><span style="font-size: small;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span><span style="font-weight: 400;">5. </span>07-05.呼叫printMsg和sum2Ten函數<span style="font-weight: 400;">:</span></span></span><span style="font-weight: normal;">請讀者們自行和</span> <span style="color: #0000ee;"><span style="font-weight: 400;"><u>https://reurl.cc/jGabAM</u></span></span><span style="color: #222222;"><span style="font-weight: 400;"> 的未函數化的連續累計求和版本對照。</span></span></span></div><div class="separator" style="clear: both;"><span style="color: #222222; font-size: small;"><span style="font-weight: 400;"><span style="color: #222222; text-align: right;"><span><span><span style="color: black;">將 </span></span></span></span><span style="color: black; text-align: left;">Python 程式</span><span style="color: black; text-align: left;">轉換妥後</span><span style="color: black;">以「</span><span style="color: black; font-weight: 700; text-align: center;"><span><span style="font-weight: 400; white-space: pre-wrap;">07-05.呼叫printMsg和sum2Ten函數.py」存檔執行</span></span></span><span style="color: black;">後就能看到</span><span style="color: black; text-align: left;">如圖 8</span><span style="color: black; text-align: left;"> 所對應的</span><span style="color: black;">執行結果。</span></span></span></div><div class="separator" style="clear: both;"><span style="color: #222222; font-size: small;"><span style="font-weight: 400;"><span style="color: black;"><br /></span></span></span></div><div class="separator" style="clear: both; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span><span style="font-weight: 400;"><div class="separator" style="clear: both; font-size: medium;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEg8XlvoD3zk5gvbVejC-W2if5PTXnZJ_fyy9EGXGuRT1C-Y9cqxXsJir6OZ3WQvLkiBkbJfXvEWt4C_EktOmAOm9-n1hwzT5vyQtJo0lx5ZVoSEQkuDDdsRTBOb1UdNhyBSbYSpd7SDduPUm2jC0gcbtSmHBi678WGUX5YqVW9zhK2XwwBb__SGpA" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="868" data-original-width="1809" src="https://blogger.googleusercontent.com/img/a/AVvXsEg8XlvoD3zk5gvbVejC-W2if5PTXnZJ_fyy9EGXGuRT1C-Y9cqxXsJir6OZ3WQvLkiBkbJfXvEWt4C_EktOmAOm9-n1hwzT5vyQtJo0lx5ZVoSEQkuDDdsRTBOb1UdNhyBSbYSpd7SDduPUm2jC0gcbtSmHBi678WGUX5YqVW9zhK2XwwBb__SGpA=s16000" /></a></div></div><span style="font-size: x-small;">圖 8:訊息輸出與連加求和函數</span></span></span></span></div></h3></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="text-align: justify;"><span><br /></span></div><div class="separator" style="text-align: justify;"><span>6. <b>07-06.呼叫和顯示BMI值</b>:</span>承 2 和 5,留給讀者們自行練習。</div><div class="separator" style="text-align: justify;"><span><!--more--></span></div></div></div></div></div></span></div></div><div><div style="background-color: white;"><ol><li style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; margin: 0px 0px 0.25em; padding: 0px; text-align: justify;"><span style="font-size: x-small;"><a href="http://creativecommons.tw/explore" style="background-color: transparent; color: #2288bb; font-family: times, "times new roman", serif; text-decoration-line: none;" target="_blank">六種授權條款</a><span face="arial, tahoma, helvetica, freesans, sans-serif" style="background-color: transparent;">。</span></span></li><li style="margin: 0px 0px 0.25em; padding: 0px; text-align: justify;"><span><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="background-color: transparent; color: #222222; font-size: x-small;"><b>定義(define)</b>與<b>呼叫(call)</b>。</span></span></li></ol></div></div>Ted Leehttp://www.blogger.com/profile/03077454870590095355noreply@blogger.com0tag:blogger.com,1999:blog-1468347421357730785.post-1688712504145958832022-08-26T06:53:00.086+08:002022-10-22T06:22:28.941+08:00[micro:bit, touch] 小彼特 V2 版三大新板載功能原理解說:觸控(touch)<h1 style="text-align: center;"><span style="font-size: 21.3333px;">小彼特 V2 版三大新板載功能原理解說:觸控(touch)</span></h1><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><a href="https://www.facebook.com/groups/134149180510967/" style="color: #2288bb; text-decoration-line: none;" target="_blank"><span style="font-family: times, "times new roman", serif;">Ted Lee的土饅頭(To Mentor)工坊</span></a></div><div style="text-align: center;"><div><span style="color: #222222; font-family: times, "times new roman", serif; font-size: 13.2px;">Line:ted2016.kpvs</span><br /><span style="color: #222222; font-family: times, "times new roman", serif; font-size: 13.2px;">Email:Lct4246@gmail.com</span><br /><span style="color: #222222; font-family: times, "times new roman", serif;"><span style="font-family: "times new roman", serif;">FB</span>:</span><span style="font-family: times new roman, serif;"><a href="https://pse.is/TedLeeFB"><span style="color: #222222;">https://pse.is/</span><span style="color: #6aa84f;">TedLee</span><span style="color: red;">FB</span></a></span></div><div><span lang="" style="color: #222222; font-family: times, "times new roman", serif; font-size: 12pt;">Blog<span style="font-family: "times new roman"; font-size: small;">:</span></span><span style="font-family: times, times new roman, serif;"><a href="https://pse.is/TedLeeBlog" style="outline-width: 0px; user-select: auto;"><span style="color: #222222;">https://pse.is/</span><span style="color: #6aa84f;">TedLee</span><span style="color: red;">Blog</span></a></span></div><div><br /></div></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><span style="font-family: times, "times new roman", serif;">Aug. 26, 2022</span></div><div style="text-align: center;"><span><span style="font-family: times, "times new roman", serif;"><span><div class="separator" style="clear: both; color: #222222; font-size: 13.2px;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s88/CC.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="31" data-original-width="88" height="31" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s1600/CC.png" width="88" /></a>[1]</div><div class="separator" style="clear: both; color: #222222; font-size: 13.2px;"><br /></div><div class="separator" style="clear: both; color: #222222; text-align: justify;">2020 年 10 月,<a href="https://microbit.org" target="_blank">小彼特教育基金會(Micro:bit Educational Foundation)(https://microbit.org)</a>發行了 V2 版的新版硬體,V2 只比 V1 小幅度地增加了三項主要的<a href="https://microbit.org/new-microbit/" target="_blank">新<b>板載(on board)</b>功能(https://reurl.cc/AOM1rd)</a>:<b>商標觸控(logo touch)</b>、<b>麥克風(microphone)</b>與<b>蜂鳴器(buzzer)</b>。</div><div class="separator" style="clear: both; text-align: justify;"><div class="separator" style="clear: both; color: #222222;">看熱鬧也要看門道,曹齊平老師說:</div><div class="separator" style="clear: both; color: #222222;"><br /></div><div class="separator" style="clear: both; color: #222222; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXeyFLJORHD8hVvFxLFioZGaw1CdPslOR45INw8s72WyP4TSnmZWQVjlu2QCg--hB1T-gM_-COLCz8lAocsmn2LROHCIKPQoSAj9JhKSnNrCCKFB4VvggrFiN8ZS-SQoBrXn_ARBKgQtnB9N7khSF58nKp-yQrKMiLBr0o9qWlLWWp9nXjb8R-BA/s728/%E7%9F%A5%E8%AD%98%E8%A6%81%E5%AD%B8%E5%88%B0%E4%B8%8B%E5%85%A9%E8%87%B3%E4%B8%89%E5%B1%A4%E6%89%8D%E6%9C%89%E6%A9%9F%E6%9C%83%E6%87%89%E7%94%A8%EF%BC%81%E3%80%80%EF%BD%9E%E6%9B%B9%E9%BD%8A%E5%B9%B3%20%E8%80%81%E5%B8%AB.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="158" data-original-width="728" height="69" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXeyFLJORHD8hVvFxLFioZGaw1CdPslOR45INw8s72WyP4TSnmZWQVjlu2QCg--hB1T-gM_-COLCz8lAocsmn2LROHCIKPQoSAj9JhKSnNrCCKFB4VvggrFiN8ZS-SQoBrXn_ARBKgQtnB9N7khSF58nKp-yQrKMiLBr0o9qWlLWWp9nXjb8R-BA/s320/%E7%9F%A5%E8%AD%98%E8%A6%81%E5%AD%B8%E5%88%B0%E4%B8%8B%E5%85%A9%E8%87%B3%E4%B8%89%E5%B1%A4%E6%89%8D%E6%9C%89%E6%A9%9F%E6%9C%83%E6%87%89%E7%94%A8%EF%BC%81%E3%80%80%EF%BD%9E%E6%9B%B9%E9%BD%8A%E5%B9%B3%20%E8%80%81%E5%B8%AB.png" width="320" /></a></div><div class="separator" style="clear: both; color: #222222; text-align: center;"><br /></div><div class="separator" style="clear: both; color: #222222; text-align: justify;">「基礎」知識的學習應該是了解底層最共通的原理、原則<b>,</b>而不是盲目無止盡地去競逐新科技的應用[2]。</div><div class="separator" style="clear: both; text-align: justify;"><span style="color: #222222;">因此,就讓我們以在 vMaker 連載的三篇文章來闡述這個學習理念,並且我們也援用曹老師的</span><a href="http://www.letry.com.tw/product.html" style="color: #222222;" target="_blank">科學魔法車(https://reurl.cc/W104m7)</a><span style="color: #222222;">的電學基礎小實驗,落實「</span><span style="color: red;">動手做以建立知識直觀</span><span style="color: #222222;">」的學習根本大法。</span></div></div></span></span></span></div><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><o:p></o:p></span><p></p><h2 style="text-align: left;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">建立直觀</span></h2><p class="MsoQuote" style="text-align: justify;">小彼特 V2 版在它正面的商標處<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5zK8HPjldAC_oc2jEuffV4UL9KO63vDexn5sQ9uxleAwe2L0tsJ1Q422Eaf70F5h0F_coUEZr6ol6KYJxFe3M73OYrHl7ygEfoPHWxvNjKOl8Ki_UnX25jySBgrDiLTFQWY5F3y2xEnBci2TI0MUXqrmKswN_En3UqJvNeGkqO_3Xe9_JtRQrJw/s341/%E8%B1%AC%E9%BC%BB%E5%AD%90.jpg" style="margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" data-original-height="202" data-original-width="341" height="27" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5zK8HPjldAC_oc2jEuffV4UL9KO63vDexn5sQ9uxleAwe2L0tsJ1Q422Eaf70F5h0F_coUEZr6ol6KYJxFe3M73OYrHl7ygEfoPHWxvNjKOl8Ki_UnX25jySBgrDiLTFQWY5F3y2xEnBci2TI0MUXqrmKswN_En3UqJvNeGkqO_3Xe9_JtRQrJw/w45-h27/%E8%B1%AC%E9%BC%BB%E5%AD%90.jpg" width="45" /></a>板載了<b>電容式(capacitive)</b>觸控的功能:</p><p class="MsoQuote" style="text-align: justify;">當我們用指尖去輕觸這個商標時就會觸發小彼特的硬體觸控電路,然後執行對應的處理程式,</p><p class="MsoQuote" style="text-align: justify;">例如:播放音效。功能展示影片請參考圖 1。</p><p class="MsoQuote" style="text-align: justify;"><br /></p><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/MFxGYmXx-sg" width="320" youtube-src-id="MFxGYmXx-sg"></iframe></div><div style="text-align: center;"><span style="font-size: x-small;"><span>圖 1:電容式觸控(</span><a href="https://reurl.cc/W1N2Ey" style="text-align: justify;">https://reurl.cc/W1N2Ey</a>)</span></div><h2 style="text-align: left;">電路原理</h2><div class="separator" style="clear: both; text-align: justify;">V2 版新加的這個觸控功能,其實是實做了一個 <span style="color: red;">RC 延遲(delay)電路</span>(圖 2)。而我們也可以用其他未實作此電路的接腳,以<span style="color: red;">外接</span>電路的方式來達成觸控的功能---甚至使用 V1 版也成(圖 3)[2]。</div><div class="separator" style="clear: both; text-align: justify;">如圖 3 的藍色虛線所示,當手指未觸碰電路時,<span style="color: red;">3V <span face=""新細明體",serif" style="font-size: 12pt; mso-ansi-language: EN-US; mso-ascii-theme-font: minor-fareast; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 11.0pt; mso-bidi-language: AR-SA; mso-bidi-theme-font: minor-bidi; mso-fareast-language: ZH-TW; mso-fareast-theme-font: minor-fareast; mso-hansi-theme-font: minor-fareast;">→</span> 10M<span style="font-family: Symbol; font-size: 12pt; text-align: left;">W</span> <span face=""新細明體",serif" style="font-size: 12pt; mso-ansi-language: EN-US; mso-ascii-theme-font: minor-fareast; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 11.0pt; mso-bidi-language: AR-SA; mso-bidi-theme-font: minor-bidi; mso-fareast-language: ZH-TW; mso-fareast-theme-font: minor-fareast; mso-hansi-theme-font: minor-fareast;">→</span> P8</span> 將形成<b>電路迴路(circuit loop)</b>。</div><div class="separator" style="clear: both; text-align: justify;">然而,當我們用手去觸碰圖 2 中的 A 點時,手指頭等效於圖中右邊的由 A 並接到地的<b>電容(cpacitor)</b>而讓電路形成延遲的效果(<a href="https://reurl.cc/XVZqqg">https://reurl.cc/XVZqqg</a>)。此時,電路 A 點的電位會因為這個電容慢慢充電而致使電位爬升的瞬間形成「<span style="color: red;">低(0) <span face=""新細明體",serif" style="font-size: 12pt; mso-ansi-language: EN-US; mso-ascii-theme-font: minor-fareast; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 11.0pt; mso-bidi-language: AR-SA; mso-bidi-theme-font: minor-bidi; mso-fareast-language: ZH-TW; mso-fareast-theme-font: minor-fareast; mso-hansi-theme-font: minor-fareast;">→</span> 高(1)</span>」的變化。所以,我們就可以利用這個原理來偵測手指是否按壓了 A 點。</div><div class="separator" style="clear: both; text-align: justify;">也就是說,當手指觸踫了 A 點(圖 3),小彼特的 P8 腳位就會收到 <span style="color: red;">0</span>。註:讀者可自行使用電錶併接驗證之。</div><div class="separator" style="clear: both; text-align: justify;">詳細的解說影片請參考圖 4。</div><div class="separator" style="clear: both; text-align: justify;"><br /></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhj7xgnKlQktj1zxY6ILES5Kva3F5ahcyqxDThBcIwV_jnGQVvOySS2BpCkOzG7u-aE71Z1K66T8A8nUAIJ8oUEiSWeeYP-S_KD01tm4PUedKjoJVYiyfhzurNk9anzoTFAD8Qso8N6PZVM5pOaToJrISKsNPT7JcuO3yCYm2PE4WBAgcG1jPsTaQ/s361/RC%20%E5%BB%B6%E9%81%B2%E9%9B%BB%E8%B7%AF.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="182" data-original-width="361" height="201" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhj7xgnKlQktj1zxY6ILES5Kva3F5ahcyqxDThBcIwV_jnGQVvOySS2BpCkOzG7u-aE71Z1K66T8A8nUAIJ8oUEiSWeeYP-S_KD01tm4PUedKjoJVYiyfhzurNk9anzoTFAD8Qso8N6PZVM5pOaToJrISKsNPT7JcuO3yCYm2PE4WBAgcG1jPsTaQ/w400-h201/RC%20%E5%BB%B6%E9%81%B2%E9%9B%BB%E8%B7%AF.jpg" width="400" /></a></div><div class="separator" style="clear: both; text-align: center;"><span style="font-size: x-small;"><span>圖 2:觸控等效的 RC </span><span>延遲</span><span>電路</span></span></div><div class="separator" style="clear: both; text-align: center;"><br /></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhA-um60imWKfFdcJQOcjY5G9ttKvF3PFzl7Nw2okkxUEz9mjbbbYf7_Ycxl2AkuCs0jSffZtxKWB3KzilHihWa6cV4jATZSnQlM4gcEDdaPIumyhZpC5-_u7OOOOb639l7ZwVK9L_P_xgKrY727qPlCoW7wX1BYPQwmezJN3PRF_WEi_xoGUqE8A/s910/%E6%8E%A5%E7%B7%9A%E5%9C%96.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="910" data-original-width="628" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhA-um60imWKfFdcJQOcjY5G9ttKvF3PFzl7Nw2okkxUEz9mjbbbYf7_Ycxl2AkuCs0jSffZtxKWB3KzilHihWa6cV4jATZSnQlM4gcEDdaPIumyhZpC5-_u7OOOOb639l7ZwVK9L_P_xgKrY727qPlCoW7wX1BYPQwmezJN3PRF_WEi_xoGUqE8A/w276-h400/%E6%8E%A5%E7%B7%9A%E5%9C%96.jpg" width="276" /></a></div><div style="background: white; break-after: avoid; text-align: center;"><span style="font-size: x-small;"><a name="_Ref111620918" style="background-color: transparent;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">圖</span></a><span style="background-color: transparent; mso-bookmark: _Ref111620918;"><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> 3:接線圖</span></span></span></div><div style="background: white; break-after: avoid; text-align: center;"><span style="font-family: Times New Roman, serif; font-size: x-small;"><br /></span><span style="font-size: x-small;"><span style="background-color: transparent; mso-bookmark: _Ref111620918;"><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/3JFw2U20290" width="320" youtube-src-id="3JFw2U20290"></iframe></div></span></span><!--[if supportFields]><span
style='mso-bookmark:_Ref111620918'></span><span style='mso-element:field-begin'></span><span
style='mso-bookmark:_Ref111620918'><span lang=EN-US style='font-family:"Times New Roman",serif;
mso-fareast-font-family:標楷體'><span style='mso-spacerun:yes'> </span>SEQ </span></span><span
style='mso-bookmark:_Ref111620918'><span style='font-family:標楷體;mso-ascii-font-family:
"Times New Roman";mso-hansi-font-family:"Times New Roman";mso-bidi-font-family:
"Times New Roman"'>圖</span></span><span style='mso-bookmark:_Ref111620918'><span
lang=EN-US style='font-family:"Times New Roman",serif;mso-fareast-font-family:
標楷體'> \* ARABIC <span style='mso-element:field-separator'></span></span></span><![endif]--><span style="background-color: transparent; mso-bookmark: _Ref111620918;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><span style="mso-no-proof: yes;">圖 4</span></span></span><span face="標楷體" style="background-color: transparent; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">:<span style="font-family: Times New Roman, serif;">原理解說影片(</span></span></span><span style="font-size: x-small;"><a href="https://reurl.cc/eOyNmK" style="background-color: transparent; outline-width: 0px; text-align: justify; user-select: auto;">https://reurl.cc/eOyNmK</a><span style="background-color: transparent; text-align: justify;">)</span></span></div><h2 style="text-align: left;">程式原理</h2><div style="text-align: left;"><div class="separator" style="clear: both; text-align: justify;">為了維持小彼特輸入<b>接腳(pin)</b>的高<b>邏輯準位(logic level)</b>,圖 3 外接了一顆 10M<span style="font-family: Symbol; font-size: 16px; text-align: left;">W 的</span><b>上拉(pull-up)</b>電阻(<a href="https://reurl.cc/ERVKAn">https://reurl.cc/ERVKAn</a>) 。所以,我們在小彼特一開機時(圖 5)就將<b>晶片(chip)</b>內的拉升電阻關閉。</div><div class="separator" style="clear: both; text-align: justify;"><br /></div><div class="separator" style="clear: both; text-align: justify;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEi3i6xcgNFaaQo8rnUO9jpo_l5z4cjbHSREV7sVuovV109Kd6nci8o-gz16F9BFTQ8fcGFyQHlM1ycdzkBak8Bvo29lL9NkT65Brx1vzOcwuK8y3-JERfdzPoKbTKW2NB1rKV--1G1_zJEWSYCtQQe0XQUAF1RzjsIYlGHcNOhVbAFBGsJL9TYfZw" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="697" data-original-width="854" height="523" src="https://blogger.googleusercontent.com/img/a/AVvXsEi3i6xcgNFaaQo8rnUO9jpo_l5z4cjbHSREV7sVuovV109Kd6nci8o-gz16F9BFTQ8fcGFyQHlM1ycdzkBak8Bvo29lL9NkT65Brx1vzOcwuK8y3-JERfdzPoKbTKW2NB1rKV--1G1_zJEWSYCtQQe0XQUAF1RzjsIYlGHcNOhVbAFBGsJL9TYfZw=w640-h523" width="640" /></a></div><div class="separator" style="clear: both; text-align: center;"><span style="font-size: x-small;">(a)</span></div><div class="separator" style="clear: both; text-align: center;"><br /></div></div><div class="separator" style="clear: both; text-align: justify;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjiJhbyUw0J5wZi0ODuiesrrV-JN113jPLQtQbvawDwFghnq-8wRFp0vP5h1htg7_X3ev3pe0sIdJfz4rP047AscyXdI12pCrZ0dZwbtl5of0_dYAPIYyNZDm0iAjhlxL6V4fOC7_m-dUzZ2RDBZYsAWzbPAJwDRNAAhlUE5O6bwTahH8J3cF3M0Q" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="246" data-original-width="695" height="226" src="https://blogger.googleusercontent.com/img/a/AVvXsEjiJhbyUw0J5wZi0ODuiesrrV-JN113jPLQtQbvawDwFghnq-8wRFp0vP5h1htg7_X3ev3pe0sIdJfz4rP047AscyXdI12pCrZ0dZwbtl5of0_dYAPIYyNZDm0iAjhlxL6V4fOC7_m-dUzZ2RDBZYsAWzbPAJwDRNAAhlUE5O6bwTahH8J3cF3M0Q=w640-h226" width="640" /></a></div></div><div class="separator" style="clear: both; text-align: center;"><span style="font-size: x-small;"><a name="_Ref111790651">(b)</a></span></div><div class="separator" style="clear: both; text-align: center;"><span><a name="_Ref111790651" style="font-size: small;">圖</a><span style="font-size: small; mso-bookmark: _Ref111790651;"><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> </span></span><span style="font-size: x-small;"><!--[if supportFields]><span
style='mso-bookmark:_Ref111790651'></span><span style='mso-element:field-begin'></span><span
style='mso-bookmark:_Ref111790651'><span lang=EN-US style='font-family:"Times New Roman",serif;
mso-fareast-font-family:標楷體'><span style='mso-spacerun:yes'> </span>SEQ </span></span><span
style='mso-bookmark:_Ref111790651'><span style='font-family:標楷體;mso-ascii-font-family:
"Times New Roman";mso-hansi-font-family:"Times New Roman";mso-bidi-font-family:
"Times New Roman"'>圖</span></span><span style='mso-bookmark:_Ref111790651'><span
lang=EN-US style='font-family:"Times New Roman",serif;mso-fareast-font-family:
標楷體'> \* ARABIC <span style='mso-element:field-separator'></span></span></span><![endif]--></span><span style="font-size: small; mso-bookmark: _Ref111790651;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">5</span></span><span style="font-size: x-small;"><!--[if supportFields]><span
style='mso-bookmark:_Ref111790651'></span><span style='mso-element:field-end'></span><![endif]--></span><span style="font-size: x-small; mso-bookmark: _Ref111790651;"></span><span style="font-size: x-small; mso-bookmark: _Ref111790651;"></span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";"><span style="font-size: x-small;">:將小彼特晶片中 P8 腳位預設的拉升電阻關閉</span><br /><br /></span></span></div><div class="separator" style="clear: both; text-align: justify;"><span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">接著,只要用手去觸碰 P8 腳位(圖 3),它的電壓會因為手指的等效電容短暫充電而致使 A 點(圖 2)電位降低。此時,就讓小彼特透過板載的<b>蜂鳴器(buzzer)</b>發出特效音(圖 6)。</span></span></div><div class="separator" style="clear: both; text-align: justify;"><span style="font-size: x-small;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";"><br /></span></span></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEierFYeAHbmgBBfXMnVnM73GiGrFWDb51WvzhOMLoBgwvLIJYuxeceafVmM7GYSdGkCK_hX0hDr_NZ-dW5JC5bw0EzRLzRRqkeVtKtsvywISMhJ8kKVy13FyGY5PKojh5llvehub6mQJOG5_Co8KrQ0e21Ah8YTFvQ1qwJ1CaZ7WEq275qh-v7YsQ" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="491" data-original-width="561" height="350" src="https://blogger.googleusercontent.com/img/a/AVvXsEierFYeAHbmgBBfXMnVnM73GiGrFWDb51WvzhOMLoBgwvLIJYuxeceafVmM7GYSdGkCK_hX0hDr_NZ-dW5JC5bw0EzRLzRRqkeVtKtsvywISMhJ8kKVy13FyGY5PKojh5llvehub6mQJOG5_Co8KrQ0e21Ah8YTFvQ1qwJ1CaZ7WEq275qh-v7YsQ=w400-h350" width="400" /></a></div><a name="_Ref111790651" style="font-size: small; text-align: center;"></a><div style="text-align: center;"><span style="font-size: x-small;"><a name="_Ref111790651" style="text-align: center;"></a><a name="_Ref111790651">圖</a><span style="mso-bookmark: _Ref111790651;"><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> </span></span><!--[if supportFields]><span
style='mso-bookmark:_Ref111790651'></span><span style='mso-element:field-begin'></span><span
style='mso-bookmark:_Ref111790651'><span lang=EN-US style='font-family:"Times New Roman",serif;
mso-fareast-font-family:標楷體'><span style='mso-spacerun:yes'> </span>SEQ </span></span><span
style='mso-bookmark:_Ref111790651'><span style='font-family:標楷體;mso-ascii-font-family:
"Times New Roman";mso-hansi-font-family:"Times New Roman";mso-bidi-font-family:
"Times New Roman"'>圖</span></span><span style='mso-bookmark:_Ref111790651'><span
lang=EN-US style='font-family:"Times New Roman",serif;mso-fareast-font-family:
標楷體'> \* ARABIC <span style='mso-element:field-separator'></span></span></span><![endif]--><span style="mso-bookmark: _Ref111790651;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">6</span></span><!--[if supportFields]><span
style='mso-bookmark:_Ref111790651'></span><span style='mso-element:field-end'></span><![endif]--><span style="mso-bookmark: _Ref111790651;"></span><span style="mso-bookmark: _Ref111790651;"></span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">:觸控程式</span></span></div><br /></div><div style="text-align: left;">完整程式碼可由 <a href="https://reurl.cc/QbYpko">https://reurl.cc/QbYpko</a> 下載之。</div><h2 style="text-align: left;">關於 P0、P1 和 P2 的觸控</h2><p align="center" class="MsoNormal" style="background: white; break-after: avoid; page-break-after: avoid; text-align: center;"><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"><span style="mso-spacerun: yes;"></span></span></p><div class="separator" style="clear: both; text-align: center;"><div style="text-align: justify;"><span style="font-family: "Times New Roman", serif;">在小彼特的官方文件中(<a href="https://tech.microbit.org/hardware/edgeconnector/">https://reurl.cc/7pVxv1</a>)指出,無論是 V1 或 V2, P0、P1 和 P2 這三隻接腳已內建了觸控電路,我們可以從圖 7 的電路圖中(<a href="https://github.com/microbit-foundation/microbit-reference-design/blob/master/PDF/Schematic%20Print/Schematic%20Prints.PDF" target="_blank">https://reurl.cc/XVQn8E</a>)的紅色框標示處很清楚地看到。</span></div><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"><span style="mso-spacerun: yes;"><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEiI8tcyp8S3Mv3wG4xrzoEnRlqlF7smpADdIfcrFoTEeIl0a5BRcHf4Lmy5KeAOSal3GAZm1VwOcNLAXCbVRzOfH7mcWJIrHGE1gx7ARniAdfFtcooqpuSI92Y3pnZerYd5lMH6ZKQ1BG9NkdlsQFRH0qyIsm5Z34Jy7gkqX5z0TMiTRKSprz6d9g" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="551" data-original-width="833" height="424" src="https://blogger.googleusercontent.com/img/a/AVvXsEiI8tcyp8S3Mv3wG4xrzoEnRlqlF7smpADdIfcrFoTEeIl0a5BRcHf4Lmy5KeAOSal3GAZm1VwOcNLAXCbVRzOfH7mcWJIrHGE1gx7ARniAdfFtcooqpuSI92Y3pnZerYd5lMH6ZKQ1BG9NkdlsQFRH0qyIsm5Z34Jy7gkqX5z0TMiTRKSprz6d9g=w640-h424" width="640" /></a></div></div></span></span></div><div style="text-align: center;"><span style="font-size: x-small;"><span><a name="_Ref111790651"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">圖</span></a><span style="mso-bookmark: _Ref111790651;"><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> </span></span><!--[if supportFields]><span
style='mso-bookmark:_Ref111790651'></span><span style='mso-element:field-begin'></span><span
style='mso-bookmark:_Ref111790651'><span lang=EN-US style='font-family:"Times New Roman",serif;
mso-fareast-font-family:標楷體'><span style='mso-spacerun:yes'> </span>SEQ </span></span><span
style='mso-bookmark:_Ref111790651'><span style='font-family:標楷體;mso-ascii-font-family:
"Times New Roman";mso-hansi-font-family:"Times New Roman";mso-bidi-font-family:
"Times New Roman"'>圖</span></span><span style='mso-bookmark:_Ref111790651'><span
lang=EN-US style='font-family:"Times New Roman",serif;mso-fareast-font-family:
標楷體'> \* ARABIC <span style='mso-element:field-separator'></span></span></span><![endif]--><span style="mso-bookmark: _Ref111790651;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><span style="mso-no-proof: yes;">7</span></span></span><!--[if supportFields]><span
style='mso-bookmark:_Ref111790651'></span><span style='mso-element:field-end'></span><![endif]--><span style="mso-bookmark: _Ref111790651;"></span><span style="mso-bookmark: _Ref111790651;"></span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">:</span></span><span style="text-align: left;"> P0、P1 和 P2 內建的觸控電路</span></span></div><h2 style="text-align: left;">課程設計</h2><p class="MsoListParagraph" style="background: white; margin-left: 24pt; mso-list: l0 level1 lfo1; mso-para-margin-left: 0gd; text-align: justify; text-indent: -24pt; text-justify: inter-ideograph;"><span style="text-indent: -24pt;">運用小彼特的這個觸控功能,我們設計了「</span>觸控點播」這<span style="text-indent: -24pt;">個教學活動來引導學員們體驗它。</span></p><p class="MsoListParagraph" style="background: white; margin-left: 24pt; mso-list: l0 level1 lfo1; mso-para-margin-left: 0gd; text-align: justify; text-indent: -24pt; text-justify: inter-ideograph;"></p><blockquote>當玩家第一次觸碰小彼特的豬鼻子時,播第一首歌。<span style="text-indent: -24pt;">第二次觸碰時,播第二首…。</span></blockquote><p></p><p class="MsoListParagraph" style="background: white; margin-left: 24pt; mso-list: l0 level1 lfo1; mso-para-margin-left: 0gd; text-align: justify; text-indent: -24pt; text-justify: inter-ideograph;"><span style="text-indent: -24pt;">完整的解說影片如圖 8 所示。</span></p><p class="MsoListParagraph" style="background: white; margin-left: 24pt; mso-list: l0 level1 lfo1; mso-para-margin-left: 0gd; text-align: justify; text-indent: -24pt; text-justify: inter-ideograph;"><span style="text-indent: -24pt;"><br /></span></p><p class="MsoListParagraph" style="background: white; margin-left: 24pt; mso-list: l0 level1 lfo1; mso-para-margin-left: 0gd; text-align: center; text-indent: -24pt; text-justify: inter-ideograph;"></p><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/-KS8yhV-u1w" width="320" youtube-src-id="-KS8yhV-u1w"></iframe></div><div class="separator" style="clear: both; text-align: center;"><span style="font-size: x-small;">(a) <a href="https://reurl.cc/oQK52V">https://reurl.cc/oQK52V</a></span></div><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/Pyer0up-aK8" width="320" youtube-src-id="Pyer0up-aK8"></iframe></div><div class="separator" style="clear: both; text-align: center;"><span style="font-size: x-small;">(b) <a href="https://reurl.cc/LMQ6ra">https://reurl.cc/LMQ6ra</a></span></div><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/GzMBoRwxtlw" width="320" youtube-src-id="GzMBoRwxtlw"></iframe></div><div style="text-align: center;"><span style="font-size: x-small;">(c) <a href="https://reurl.cc/bENl8d">https://reurl.cc/bENl8d</a></span></div><span style="text-indent: -24pt;"><div style="text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/FzEjdMO5l-I" width="320" youtube-src-id="FzEjdMO5l-I"></iframe></div></span><div class="separator" style="clear: both; text-align: center;"><span style="font-size: x-small;">(d) <a href="https://reurl.cc/4pbWeY">https://reurl.cc/4pbWeY</a></span></div><div class="separator" style="clear: both; text-align: center;"><span style="font-size: x-small;">圖 8:觸控點播教學解說</span></div><div><br /></div>完整程式碼可由 <a href="https://makecode.microbit.org/_4my19UFTqXsC" target="_blank">https://reurl.cc/KQO3nj</a> 下載之。<h2 style="background: white; margin-left: 24pt; text-align: justify; text-indent: -24pt;"><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-color-alt: windowtext; mso-hansi-font-family: "Times New Roman";">分享翦影</span></h2><p class="MsoListParagraph" style="background: white; margin-left: 24pt; mso-list: l0 level1 lfo1; mso-para-margin-left: 0gd; text-align: justify; text-indent: -24pt; text-justify: inter-ideograph;"></p><div class="separator" style="clear: both; text-align: justify;">如圖 9 所示。</div><div class="separator" style="clear: both; text-align: center;"><br /></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjhbj8vDDDsSeNCbHVFb7AOzrk-dbiQKybAdHRpbIJi8c6J7yHejyHq6Fdj6fvE6wifpLitrmCxd1oAMvaWo4-lp7k92P_DEyN8UZhS1-lRDddpN8IKjurY4sgs0pq5mUlf-s2JOo8Rm111bMAhFAHW5LSOri07BJV9c3Yc1mtbz3FAj4BbXW9j2A" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="1108" data-original-width="1477" height="240" src="https://blogger.googleusercontent.com/img/a/AVvXsEjhbj8vDDDsSeNCbHVFb7AOzrk-dbiQKybAdHRpbIJi8c6J7yHejyHq6Fdj6fvE6wifpLitrmCxd1oAMvaWo4-lp7k92P_DEyN8UZhS1-lRDddpN8IKjurY4sgs0pq5mUlf-s2JOo8Rm111bMAhFAHW5LSOri07BJV9c3Yc1mtbz3FAj4BbXW9j2A" width="320" /></a> <div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjOJM7W_-jmHvaK0cSfIUHYPNq7W3YMtBSpp_6lp_dq83BPRXpPQ6fFJUHKY0Z5OcrIEVbK6w6kMqffosduayglpq8qYyDzUU77g93SNT77qtY0ySTjJV_WDp5VsvIuluB8E-LOZb-peOQHKc8jLgg4yeD_0l8w7rRB8oR78Fe8R3YjcsRn92CILg" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="1108" data-original-width="1477" height="240" src="https://blogger.googleusercontent.com/img/a/AVvXsEjOJM7W_-jmHvaK0cSfIUHYPNq7W3YMtBSpp_6lp_dq83BPRXpPQ6fFJUHKY0Z5OcrIEVbK6w6kMqffosduayglpq8qYyDzUU77g93SNT77qtY0ySTjJV_WDp5VsvIuluB8E-LOZb-peOQHKc8jLgg4yeD_0l8w7rRB8oR78Fe8R3YjcsRn92CILg" width="320" /></a> </div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEiFllA4BHCdPfozdARQchsvMT_cJTqxYhYG2E3j7uIeHihX-8HYETKqdACdMM1cYNX8TV3D9PDtodR4asRKUHAIoszqZ2SKVDIM3QEk5BdHhs3D3cQl7VCBNa3Ww1J-fED1FTmjcbWm_l5DysFwLwaW0JEMU1yGEuptI3w4kEGtpHXI6co9FanphQ" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="1108" data-original-width="1477" height="240" src="https://blogger.googleusercontent.com/img/a/AVvXsEiFllA4BHCdPfozdARQchsvMT_cJTqxYhYG2E3j7uIeHihX-8HYETKqdACdMM1cYNX8TV3D9PDtodR4asRKUHAIoszqZ2SKVDIM3QEk5BdHhs3D3cQl7VCBNa3Ww1J-fED1FTmjcbWm_l5DysFwLwaW0JEMU1yGEuptI3w4kEGtpHXI6co9FanphQ" width="320" /></a></div><span style="font-size: x-small;">圖 9:觸控教學分享</span></div><p></p><h2 style="background: white; margin-left: 24pt; text-align: justify; text-indent: -24pt;"><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-color-alt: windowtext; mso-hansi-font-family: "Times New Roman";">延伸學習</span></h2><div style="background: white; margin-left: 24pt; text-align: justify; text-indent: -24pt;"><span style="text-indent: 0px;">1. 請讀者們試試看,如果一直按著這個觸控點(V2 版的商標或外接電路)時,會發生什麼狀況?</span></div><div style="background: white; margin-left: 24pt; text-align: justify; text-indent: -24pt;"><span style="background-color: transparent; font-family: "Times New Roman", serif; text-indent: 0px;">2. 改用商標觸控的事件積木(圖 ),試試看<b>按下(pressed)</b>、<b>觸碰(touched)</b>、<b>放開(released)</b>和<b>長按(long pressed)</b>這四種操作的控制差異性。</span></div><div style="background: white; margin-left: 24pt; text-align: justify; text-indent: -24pt;"><span style="background-color: transparent; font-family: "Times New Roman", serif; text-indent: 0px;"><br /></span></div><div style="background: white; margin-left: 24pt; text-align: center; text-indent: -24pt;"><span style="background-color: transparent; font-family: "Times New Roman", serif; text-indent: 0px;"><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEgiYw4NqPE2wJxUueaDoZwt0zCiorQynZbZsnFYSf24dp8lAnmZZKBBzAattpZMGkXUdlT6r54m9LIFAmmRl_n_Dqi4dhhHcJMHhPiZqJ8XAM6jI6r7kqPRBTn3nFef_XIomRHjwU-Va_OMp8VtUS8lmflXABQSi3piVreOe-lP9m4T8VIcIquCaw" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="642" data-original-width="790" height="522" src="https://blogger.googleusercontent.com/img/a/AVvXsEgiYw4NqPE2wJxUueaDoZwt0zCiorQynZbZsnFYSf24dp8lAnmZZKBBzAattpZMGkXUdlT6r54m9LIFAmmRl_n_Dqi4dhhHcJMHhPiZqJ8XAM6jI6r7kqPRBTn3nFef_XIomRHjwU-Va_OMp8VtUS8lmflXABQSi3piVreOe-lP9m4T8VIcIquCaw=w640-h522" width="640" /></a></div><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjQD2lFr4ZCirE1aAsKS_TQkCn5mAry2hvXRYnL2alKi9_2Xw5hgmPWYuhzZdXoCd4VgAqKA2IYB_ctux_6yENiiYZG29eJlbz2jJfWpyuHltxqk0p1xvzG7xTsJiP3rEZIgbKBtwtIRU3RFCinL5dvYAPFRQFwibrfHHrdX5MicTcFhb9XZdwTTg" style="background-color: transparent; margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="228" data-original-width="231" height="198" src="https://blogger.googleusercontent.com/img/a/AVvXsEjQD2lFr4ZCirE1aAsKS_TQkCn5mAry2hvXRYnL2alKi9_2Xw5hgmPWYuhzZdXoCd4VgAqKA2IYB_ctux_6yENiiYZG29eJlbz2jJfWpyuHltxqk0p1xvzG7xTsJiP3rEZIgbKBtwtIRU3RFCinL5dvYAPFRQFwibrfHHrdX5MicTcFhb9XZdwTTg=w200-h198" width="200" /></a></div></span><span style="font-size: x-small;"><a name="_Ref111790651" style="text-indent: 0px;">圖</a><span style="mso-bookmark: _Ref111790651; text-indent: 0px;"><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> </span></span><!--[if supportFields]><span
style='mso-bookmark:_Ref111790651'></span><span style='mso-element:field-begin'></span><span
style='mso-bookmark:_Ref111790651'><span lang=EN-US style='font-family:"Times New Roman",serif;
mso-fareast-font-family:標楷體'><span style='mso-spacerun:yes'> </span>SEQ </span></span><span
style='mso-bookmark:_Ref111790651'><span style='font-family:標楷體;mso-ascii-font-family:
"Times New Roman";mso-hansi-font-family:"Times New Roman";mso-bidi-font-family:
"Times New Roman"'>圖</span></span><span style='mso-bookmark:_Ref111790651'><span
lang=EN-US style='font-family:"Times New Roman",serif;mso-fareast-font-family:
標楷體'> \* ARABIC <span style='mso-element:field-separator'></span></span></span><![endif]--><span style="mso-bookmark: _Ref111790651; text-indent: 0px;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">8</span></span><!--[if supportFields]><span
style='mso-bookmark:_Ref111790651'></span><span style='mso-element:field-end'></span><![endif]--><span style="mso-bookmark: _Ref111790651; text-indent: 0px;"></span><span style="mso-bookmark: _Ref111790651; text-indent: 0px;"></span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman"; text-indent: 0px;">:流程圖與</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體; text-indent: 0px;"> MakeCode </span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman"; text-indent: 0px;">程式對</span></span><span style="background-color: transparent; font-family: "Times New Roman", serif; text-indent: 0px;"><br /><br /></span></div><div style="background: white; margin-left: 24pt; text-align: justify; text-indent: -24pt;"><br /></div><div style="background: white; margin-left: 24pt; text-align: justify; text-indent: -24pt;"><span style="background-color: transparent; font-family: "Times New Roman", serif; text-indent: 0px;"><span style="font-family: "Times New Roman";">3. 圖 3 的接線圖中,我們使用了 10M 做為上拉電阻,好奇心的讀者們一定會追問:為什麼選它?坐而言不如起而行,自己動手更換這顆電阻值來觀察會發生什麼事吧?(</span><a href="https://reurl.cc/AOM1Zp" style="font-family: "Times New Roman"; outline-width: 0px; user-select: auto;" target="_blank">https://reurl.cc/AOM1Zp</a><span style="font-family: "Times New Roman";">)</span></span></div><div style="background: white; margin-left: 24pt; text-align: justify; text-indent: -24pt;"><span style="background-color: transparent; font-family: "Times New Roman", serif; text-indent: 0px;"><span style="font-family: "Times New Roman";"><br /></span></span></div><div style="background: white; margin-left: 24pt; text-align: justify; text-indent: -24pt;"><span style="background-color: transparent; font-family: "Times New Roman", serif; text-indent: 0px;">4. 本文介紹的電容式觸控技術正是時下流行的<b>觸控螢幕(touch screen)</b>的基本原理。讀者們可進一步觀看圖 的解說影片。</span></div><p class="MsoListParagraph" style="background: white; margin-left: 24pt; mso-list: l0 level1 lfo1; mso-para-margin-left: 0gd; text-align: center; text-indent: -24pt; text-justify: inter-ideograph;"></p><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/acePdHKsor4" width="320" youtube-src-id="acePdHKsor4"></iframe></div><p></p><p class="MsoListParagraph" style="background: white; margin-left: 24pt; mso-list: l0 level1 lfo1; mso-para-margin-left: 0gd; text-align: center; text-indent: -24pt; text-justify: inter-ideograph;"></p><div style="text-align: center;"><span style="font-size: x-small;">圖 :觸控螢幕的原理(<a href="https://reurl.cc/4pLgeY">https://reurl.cc/4pLgeY</a>)</span></div><div style="mso-element: footnote-list;"><hr align="left" size="1" width="33%" /><!--[endif]--><div id="ftn1" style="mso-element: footnote;"><div style="text-align: justify;"><span style="font-size: x-small;">[1] <a href="http://creativecommons.tw/explore" style="color: #2288bb; font-family: times, "times new roman", serif; text-decoration-line: none;" target="_blank">六種授權條款</a><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;">。</span></span></div><div style="text-align: justify;"><span style="font-size: x-small;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;">[2] 基礎知識的學習應該要學萬事萬物共通性的「</span><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: red;">基本</span><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;">」原理,所謂「一理通,百里通」就是這個道理。抓粽子要抓繩頭,如果不斷的把力氣緊抓綁在繩尾的粽子上,一次能抓的粽子數量就有限。而且我們將發現:花了大把的時間和金錢之後,我們始終只能跟著廠商不斷推陳出新的商業模式走。如此,我們只能一直當花錢的<b>消費者(consumer)</b>,而非<b>學習者(learner)</b>---</span><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: red;">基礎知識學習的教具,通常不必是花俏的昂貴玩具!</span></span></div></div></div>Ted Leehttp://www.blogger.com/profile/03077454870590095355noreply@blogger.com0tag:blogger.com,1999:blog-1468347421357730785.post-82001205754950113632022-08-20T07:08:00.016+08:002022-08-21T10:21:43.899+08:00[fChart, 流程圖, micro:bit] (fChart)流程圖轉(MakeCode)程式<p style="text-align: center;"> <b style="text-align: center;"><span face="標楷體" style="font-size: 16pt;">(</span></b><b style="text-align: center;"><span lang="EN-US" style="font-family: "Times New Roman", serif; font-size: 16pt;">fChart</span></b><b style="text-align: center;"><span face="標楷體" style="font-size: 16pt;">)流程圖轉(</span></b><b style="text-align: center;"><span lang="EN-US" style="font-family: "Times New Roman", serif; font-size: 16pt;">MakeCode</span></b><b style="text-align: center;"><span face="標楷體" style="font-size: 16pt;">)程式</span></b></p>
<div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><a href="https://www.facebook.com/groups/134149180510967/" style="color: #2288bb; text-decoration-line: none;" target="_blank"><span style="font-family: times, "times new roman", serif;">Ted Lee的土饅頭(To Mentor)工坊</span></a></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><div><span style="font-family: times, "times new roman", serif;">Line:ted2016.kpvs</span><br /><span style="font-family: times, "times new roman", serif;">Email:Lct4246@gmail.com</span><br /><span style="font-family: times, "times new roman", serif;"><span style="font-family: "times new roman", serif;">FB</span>:<span style="font-family: "times new roman", serif;">http://gg.gg/</span><span style="color: #00cc00; font-family: "times new roman", serif;">TedLee</span><span style="color: red; font-family: "times new roman", serif;">FB</span><span style="font-family: "times new roman", serif;">/</span></span></div><div><span lang="" style="font-family: times, "times new roman", serif; font-size: 12pt;">Blog<span style="font-family: "times new roman"; font-size: small;">:</span>http://gg.gg/<span style="color: #00cc00;">TedLee</span><span style="color: red;">Blog</span>/</span><br /></div></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><span style="font-family: times, "times new roman", serif;"><br /></span></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: center;"><span style="font-family: times, "times new roman", serif;">Aug. 20, 2022</span></div><div style="text-align: center;"><span><span style="color: #222222; font-family: times, "times new roman", serif;"><span style="font-size: 13.2px;"><div class="separator" style="clear: both;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s88/CC.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="31" data-original-width="88" height="31" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s1600/CC.png" width="88" /></a>[0]</div></span></span></span></div>
<p class="MsoNormal" style="background: white; mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;"><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">在<b>問題解決(</b></span><b><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;">problem solving</span></b><b><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">)</span></b><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">的過程(</span><span lang="EN-US" style="color: black; mso-color-alt: windowtext;"><span style="font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"><a href="https://reurl.cc/zNry7p" target="_blank">https://reurl.cc/zNry7p</a></span></span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">)中(</span><!--[if supportFields]><span lang=EN-US
style='mso-bidi-font-size:12.0pt;font-family:"Times New Roman",serif;
mso-fareast-font-family:標楷體;color:black'><span style='mso-element:field-begin'></span>
REF _Ref109747896 \h <span style='mso-spacerun:yes'> </span>\* MERGEFORMAT <span
style='mso-element:field-separator'></span></span><![endif]--><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-color-alt: windowtext; mso-hansi-font-family: "Times New Roman";">圖</span><span style="color: black; font-family: "Times New Roman",serif; mso-color-alt: windowtext; mso-fareast-font-family: 標楷體;"> <span lang="EN-US" style="mso-no-proof: yes;">1</span></span><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"><!--[if gte mso 9]><xml>
<w:data>08D0C9EA79F9BACE118C8200AA004BA90B02000000080000000E0000005F005200650066003100300039003700340037003800390036000000</w:data>
</xml><![endif]--></span><!--[if supportFields]><span lang=EN-US
style='mso-bidi-font-size:12.0pt;font-family:"Times New Roman",serif;
mso-fareast-font-family:標楷體;color:black'><span style='mso-element:field-end'></span></span><![endif]--><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">),我們要培養用</span><b><span face="標楷體" style="color: red; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">流程圖(</span></b><b><span lang="EN-US" style="color: red; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;">flowchart</span></b><b><span face="標楷體" style="color: red; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">)</span></b><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">來表達解決問題想法的能力,以便隨後能用各種工具(例如:程式、硬體、機構…)來<b>實作(</b></span><b><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;">implement</span></b><b><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">)</span></b><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">出來。</span><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"><o:p></o:p></span></p><p class="MsoNormal" style="background: white; mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;"><span style="font-family: "Times New Roman", serif; text-indent: 24pt;"> </span></p>
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh87ibU7N1dNcue2VJHjJXJQjUwblBV3wdC0i0GpIBWpMRCynAQvKePABFd9GNUJXoD_c1E6VC-IK7kVyYSr2mBLALv6S_bMyJM_3bkcbNXxJ5L8Rf0TK5k8C9220eQBENvwwIkb79FxH_4bhKeHUfB07Ve844IjfXLFyFQs1yA60o2v2STOCpdBw/s854/A.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="381" data-original-width="854" height="286" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh87ibU7N1dNcue2VJHjJXJQjUwblBV3wdC0i0GpIBWpMRCynAQvKePABFd9GNUJXoD_c1E6VC-IK7kVyYSr2mBLALv6S_bMyJM_3bkcbNXxJ5L8Rf0TK5k8C9220eQBENvwwIkb79FxH_4bhKeHUfB07Ve844IjfXLFyFQs1yA60o2v2STOCpdBw/w640-h286/A.png" width="640" /></a></div><div style="background: white; break-after: avoid; text-align: center;"><span style="font-size: x-small;"><a name="_Ref109747896" style="background-color: transparent;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">圖</span></a><span style="background-color: transparent; mso-bookmark: _Ref109747896;"><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> </span></span><!--[if supportFields]><span
style='mso-bookmark:_Ref109747896'></span><span style='mso-element:field-begin'></span><span
style='mso-bookmark:_Ref109747896'><span lang=EN-US style='font-family:"Times New Roman",serif;
mso-fareast-font-family:標楷體'><span style='mso-spacerun:yes'> </span>SEQ </span></span><span
style='mso-bookmark:_Ref109747896'><span style='font-family:標楷體;mso-ascii-font-family:
"Times New Roman";mso-hansi-font-family:"Times New Roman";mso-bidi-font-family:
"Times New Roman"'>圖</span></span><span style='mso-bookmark:_Ref109747896'><span
lang=EN-US style='font-family:"Times New Roman",serif;mso-fareast-font-family:
標楷體'> \* ARABIC <span style='mso-element:field-separator'></span></span></span><![endif]--><span style="background-color: transparent; mso-bookmark: _Ref109747896;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><span style="mso-no-proof: yes;">1</span></span></span><!--[if supportFields]><span
style='mso-bookmark:_Ref109747896'></span><span style='mso-element:field-end'></span><![endif]--><span style="background-color: transparent; mso-bookmark: _Ref109747896;"></span><span style="background-color: transparent; mso-bookmark: _Ref109747896;"></span><span face="標楷體" style="background-color: transparent; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">:問題解決的流程</span></span></div>
<p class="MsoNormal"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><o:p> </o:p></span></p>
<p class="MsoNormal" style="mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">本文將從陳會安老師彙整的</span><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> <span lang="EN-US" style="color: red;">fChart 150 </span></span><span face="標楷體" style="color: red; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">題</span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman"; mso-themecolor: text1;">(文後皆以</span><span style="color: black; font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體; mso-themecolor: text1;"> <span lang="EN-US">fChart 150 </span></span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman"; mso-themecolor: text1;">稱之)</span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">流程圖範例(</span><span lang="EN-US"><span style="border: 1pt none windowtext; font-family: "Times New Roman",serif; font-size: 11.5pt; mso-border-alt: none windowtext 0in; mso-fareast-font-family: 標楷體; padding: 0in;"><a href="https://reurl.cc/bE97Q6" target="_blank">https://reurl.cc/bE97Q6</a></span></span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">)中展示流程圖的有限符號是很容易和各類型的程式語言(本文將以</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> MakeCode </span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">的積木程式為例)對應轉換的。這個轉換練習將有助於初學者熟稔程式邏輯,也就是說,當我們能將原始問題找到了一種解法之後,只要能將之以流程圖來表示,這個解法就能以工具來實作出來。因此,我們可以說:</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><o:p></o:p></span></p>
<p class="MsoNormal" style="mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><o:p> </o:p></span></p>
<p class="MsoQuote"><span face="標楷體" style="color: red; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";"></span></p><blockquote style="text-align: center;"><span face="標楷體" style="color: red; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">流程圖為程式邏輯之母</span></blockquote><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><o:p></o:p></span><p></p>
<h1><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">問題</span><span lang="EN-US"><o:p></o:p></span></h1>
<p class="MsoQuote" style="text-align: center;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">重複顯示五次</span><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> <span lang="EN-US">Hi<o:p></o:p></span></span></p>
<p class="MsoNormal" style="background: white; mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;"><span lang="EN-US" style="color: #222222; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"><o:p> </o:p></span></p>
<p class="MsoNormal" style="background: white; mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;"><span face="標楷體" style="color: #222222; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">上述問題改編自前述</span><span style="color: #222222; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;">
<span lang="EN-US">fChart 150 </span></span><span face="標楷體" style="color: #222222; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">中的「</span><span lang="EN-US" style="color: #222222; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;">04.</span><span face="標楷體" style="color: #222222; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">迴圈結構</span><span lang="EN-US" style="color: #222222; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;">─01.</span><span face="標楷體" style="color: #222222; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">前測</span><span lang="EN-US" style="color: #222222; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;">_</span><span face="標楷體" style="color: #222222; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">顯示</span><span lang="EN-US" style="color: #222222; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;">5</span><span face="標楷體" style="color: #222222; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">次大家好」來說明從流程圖轉換到</span><span lang="EN-US" style="color: #222222; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"> MakeCode </span><span face="標楷體" style="color: #222222; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">積木程式的整個操作過程。因為</span><span lang="EN-US" style="color: #222222; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"> micro:bit </span><span face="標楷體" style="color: #222222; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">無法顯示中文,我們將要顯示的文字修改為英文</span><span lang="EN-US" style="color: #222222; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"> Hi</span><span face="標楷體" style="color: #222222; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">。</span><span lang="EN-US" style="color: #222222; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"><o:p></o:p></span></p>
<h1><a name="_Hlk111636381"><span lang="EN-US">fChart </span></a><span style="mso-bookmark: _Hlk111636381;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">流程圖範例</span><span lang="EN-US" style="color: black;"><o:p></o:p></span></span></h1>
<p class="MsoNormal" style="background: white; margin-bottom: 13.5pt; mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;"><span style="mso-bookmark: _Hlk111636381;"><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">首先,我們從</span></span><span style="mso-bookmark: _Hlk111636381;"></span><!--[if supportFields]><span
style='mso-bookmark:_Hlk111636381'></span><span style='mso-element:field-begin'></span><span
style='mso-bookmark:_Hlk111636381'><span lang=EN-US style='mso-bidi-font-size:
12.0pt;font-family:"Times New Roman",serif;mso-fareast-font-family:標楷體;
color:black'> REF _Ref111620918 \h <span style='mso-spacerun:yes'> </span>\*
MERGEFORMAT <span style='mso-element:field-separator'></span></span></span><![endif]--><span style="mso-bookmark: _Hlk111636381;"></span><span style="mso-bookmark: _Hlk111636381;"><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-color-alt: windowtext; mso-hansi-font-family: "Times New Roman";">圖</span></span><span style="mso-bookmark: _Hlk111636381;"><span style="color: black; font-family: "Times New Roman",serif; mso-color-alt: windowtext; mso-fareast-font-family: 標楷體;"> <span lang="EN-US" style="mso-no-proof: yes;">2</span></span></span><span style="mso-bookmark: _Hlk111636381;"><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"><!--[if gte mso 9]><xml>
<w:data>08D0C9EA79F9BACE118C8200AA004BA90B02000000080000000E0000005F005200650066003100310031003600320030003900310038000000</w:data>
</xml><![endif]--></span></span><!--[if supportFields]><span style='mso-bookmark:
_Hlk111636381'></span><span style='mso-element:field-end'></span><![endif]--><span style="mso-bookmark: _Hlk111636381;"><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"> </span></span><span style="mso-bookmark: _Hlk111636381;"><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">中可以看到紅框標示部份即為<b>迴圈(</b></span></span><span style="mso-bookmark: _Hlk111636381;"><b><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;">loop</span></b></span><span style="mso-bookmark: _Hlk111636381;"><b><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">)</span></b></span><span style="mso-bookmark: _Hlk111636381;"><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">。迴圈的控制</span></span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">有三個要素:</span><span face="標楷體" style="color: red; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">迴圈控制變數</span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">(</span><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;">a</span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">)、</span><span face="標楷體" style="color: red; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">迴圈控判斷式</span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">(</span><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;">a
<= 5</span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">)及</span><span face="標楷體" style="color: red; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">迴圈控制變數累加</span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">(</span><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;">a = a + 1</span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">)。而每次進入迴圈時,我們就輸出一次</span><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"> Hi</span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">。流程圖的執行結果如</span><!--[if supportFields]><span
lang=EN-US style='mso-bidi-font-size:12.0pt;font-family:"Times New Roman",serif;
mso-fareast-font-family:標楷體;color:black'><span style='mso-element:field-begin'></span>
REF _Ref111620918 \h <span style='mso-spacerun:yes'> </span>\* MERGEFORMAT <span
style='mso-element:field-separator'></span></span><![endif]--><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-color-alt: windowtext; mso-hansi-font-family: "Times New Roman";">圖</span><span style="color: black; font-family: "Times New Roman",serif; mso-color-alt: windowtext; mso-fareast-font-family: 標楷體;"> <span lang="EN-US" style="mso-no-proof: yes;">2</span></span><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"><!--[if gte mso 9]><xml>
<w:data>08D0C9EA79F9BACE118C8200AA004BA90B02000000080000000E0000005F005200650066003100310031003600320030003900310038000000</w:data>
</xml><![endif]--></span><!--[if supportFields]><span lang=EN-US
style='mso-bidi-font-size:12.0pt;font-family:"Times New Roman",serif;
mso-fareast-font-family:標楷體;color:black'><span style='mso-element:field-end'></span></span><![endif]--><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"> </span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">右上的黑底小視窗所示。</span><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"><o:p></o:p></span></p>
<p class="MsoNormal" style="background: white; margin-bottom: 13.5pt; mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;"><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">以上這段為</span><span face="標楷體" style="color: red; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">流程圖</span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">(認)</span><span face="標楷體" style="color: red; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">識</span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">(與閱)</span><span face="標楷體" style="color: red; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">讀</span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">,讀者們應該可以試著自己講給自己聽。如果能說的完整而無卡頓就代表我們真的讀懂了這個流程圖。讀懂之後再想想程式要重複輸出五次相同<b>字串(</b></span><b><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;">string</span></b><b><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">)</span></b><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;">─</span><span face="標楷體" style="color: red; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">問題</span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">和這個流程圖是如何解決這個問題的</span><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;">─</span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">(解決問題的)</span><span face="標楷體" style="color: red; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">想法</span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">。因此,我們的程式邏輯就能在這樣的練功過程中被紮實的建立了。</span><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"><o:p></o:p></span></p>
<p class="MsoNormal" style="background: white; margin-bottom: 13.5pt; mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;"><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"><o:p> </o:p></span></p>
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZ7kk3ojAjFPNur8fZ6AWGH-ll3xtYBnJn1JbHwiBpA6ZlPVxdJPClGWF-EKdJmq-mXtj5O_Zcj6EiIRsmIL2KYTvyAqDckPDxMHN9MHLYuOAID3ABwB7YNSicB9iUiNX4clh4z_eWdg7wn0rq02ItHU13CesyDQG1PO2Kp51Kvj37-OFalKNuQw/s478/B.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="459" data-original-width="478" height="384" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZ7kk3ojAjFPNur8fZ6AWGH-ll3xtYBnJn1JbHwiBpA6ZlPVxdJPClGWF-EKdJmq-mXtj5O_Zcj6EiIRsmIL2KYTvyAqDckPDxMHN9MHLYuOAID3ABwB7YNSicB9iUiNX4clh4z_eWdg7wn0rq02ItHU13CesyDQG1PO2Kp51Kvj37-OFalKNuQw/w400-h384/B.jpg" width="400" /></a></div><div style="background: white; break-after: avoid; text-align: center;"><span style="font-size: x-small;"><a name="_Ref111620918" style="background-color: transparent;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">圖</span></a><span style="background-color: transparent; mso-bookmark: _Ref111620918;"><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> </span></span><!--[if supportFields]><span
style='mso-bookmark:_Ref111620918'></span><span style='mso-element:field-begin'></span><span
style='mso-bookmark:_Ref111620918'><span lang=EN-US style='font-family:"Times New Roman",serif;
mso-fareast-font-family:標楷體'><span style='mso-spacerun:yes'> </span>SEQ </span></span><span
style='mso-bookmark:_Ref111620918'><span style='font-family:標楷體;mso-ascii-font-family:
"Times New Roman";mso-hansi-font-family:"Times New Roman";mso-bidi-font-family:
"Times New Roman"'>圖</span></span><span style='mso-bookmark:_Ref111620918'><span
lang=EN-US style='font-family:"Times New Roman",serif;mso-fareast-font-family:
標楷體'> \* ARABIC <span style='mso-element:field-separator'></span></span></span><![endif]--><span style="background-color: transparent; mso-bookmark: _Ref111620918;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><span style="mso-no-proof: yes;">2</span></span></span><!--[if supportFields]><span
style='mso-bookmark:_Ref111620918'></span><span style='mso-element:field-end'></span><![endif]--><span style="background-color: transparent; mso-bookmark: _Ref111620918;"></span><span style="background-color: transparent; mso-bookmark: _Ref111620918;"></span><span face="標楷體" style="background-color: transparent; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">:</span><span lang="EN-US" style="background-color: transparent; font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">fChart </span><span face="標楷體" style="background-color: transparent; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">流程圖及其執行結果</span></span></div>
<h1><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">流程圖追蹤(</span><span lang="EN-US">trace</span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">)</span><span lang="EN-US"><o:p></o:p></span></h1>
<p class="MsoNormal" style="mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;"><b><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">結構化程式設計(</span></b><b><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">structural
programming</span></b><b><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">)</span></b><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">由循序、選擇進入到重複結構後,是初學者很容易卡關的點,其原因概是對某些人而言,程式執行邏輯過於抽象化所致</span><a href="https://d.docs.live.net/f89b2e10c0c5aa13/Writing/%E8%B3%87%E8%A8%8A%E5%AD%B8%E7%A7%91%E4%B8%AD%E5%BF%83/%EF%BC%88fChart%EF%BC%89%E6%B5%81%E7%A8%8B%E5%9C%96%E8%BD%89%EF%BC%88MakeCode%EF%BC%89%E7%A8%8B%E5%BC%8F/%EF%BC%88fChart%EF%BC%89%E6%B5%81%E7%A8%8B%E5%9C%96%E8%BD%89%EF%BC%88MakeCode%EF%BC%89%E7%A8%8B%E5%BC%8F.docx#_ftn1" name="_ftnref1" style="mso-footnote-id: ftn1;" title=""><span class="MsoFootnoteReference"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><span style="mso-special-character: footnote;"><!--[if !supportFootnotes]--><span class="MsoFootnoteReference"><span lang="EN-US" style="font-family: "Times New Roman",serif; font-size: 12pt; mso-ansi-language: EN-US; mso-bidi-font-size: 11.0pt; mso-bidi-language: AR-SA; mso-fareast-font-family: 標楷體; mso-fareast-language: ZH-TW;">[</span></span><!--[endif]--></span></span></span></a>1]<span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">。因此,本小節詳細地展示如何追蹤迴圈執行流程及其迴圈控制變數變化的一連串過程,即變數<b>監看(</b></span><b><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">watch</span></b><b><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">)</span></b><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">,來協助初學者打通程式設計的任督二脈。我們將使用</span><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> <span lang="EN-US">fChart</span></span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">的<b>單步執行(</b></span><b><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">single-step execution</span></b><b><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">)</span></b><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">功能,逐步地追蹤</span><!--[if supportFields]><span
lang=EN-US style='mso-bidi-font-size:12.0pt;font-family:"Times New Roman",serif;
mso-fareast-font-family:標楷體;color:black'><span style='mso-element:field-begin'></span>
REF _Ref111620918 \h<span style='mso-spacerun:yes'> </span>\* MERGEFORMAT <span
style='mso-element:field-separator'></span></span><![endif]--><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">圖</span><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> <span lang="EN-US" style="mso-no-proof: yes;">2</span></span><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"><!--[if gte mso 9]><xml>
<w:data>08D0C9EA79F9BACE118C8200AA004BA90B02000000080000000E0000005F005200650066003100310031003600320030003900310038000000</w:data>
</xml><![endif]--></span><!--[if supportFields]><span lang=EN-US
style='mso-bidi-font-size:12.0pt;font-family:"Times New Roman",serif;
mso-fareast-font-family:標楷體;color:black'><span style='mso-element:field-end'></span></span><![endif]--><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"> </span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">的完整執行過程。讀者們請特別留意此強大的視覺化功能可以十分穩固地增進我們對程式邏輯的具體了解,但前題是紮馬步的基本功一定要自己「動手」去練、去體會!</span></p>
<h2><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">設定</span><span lang="EN-US"> fChart </span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">直譯器(</span><span lang="EN-US">interpreter</span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">)</span><span lang="EN-US"><o:p></o:p></span></h2>
<p class="MsoNormal" style="margin-left: 15pt; mso-char-indent-count: -1.25; text-align: justify; text-indent: -15pt; text-justify: inter-ideograph;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">1. </span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">從</span><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> </span><span lang="EN-US"><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體; outline-width: 0px !important; user-select: auto !important;"><a href="https://reurl.cc/D3m6Aj" target="_blank">https://reurl.cc/D3m6Aj</a></span></span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> </span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">下載<a name="_Hlk111708477">「</a></span><span style="mso-bookmark: _Hlk111708477;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">04-01.</span></span><span style="mso-bookmark: _Hlk111708477;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">前測</span></span><span style="mso-bookmark: _Hlk111708477;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">_</span></span><span style="mso-bookmark: _Hlk111708477;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">顯示</span></span><span style="mso-bookmark: _Hlk111708477;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">5</span></span><span style="mso-bookmark: _Hlk111708477;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">次</span></span><span style="mso-bookmark: _Hlk111708477;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">Hi.fpp</span></span><span style="mso-bookmark: _Hlk111708477;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">」</span></span><span style="mso-bookmark: _Hlk111708477;"></span><a href="https://d.docs.live.net/f89b2e10c0c5aa13/Writing/%E8%B3%87%E8%A8%8A%E5%AD%B8%E7%A7%91%E4%B8%AD%E5%BF%83/%EF%BC%88fChart%EF%BC%89%E6%B5%81%E7%A8%8B%E5%9C%96%E8%BD%89%EF%BC%88MakeCode%EF%BC%89%E7%A8%8B%E5%BC%8F/%EF%BC%88fChart%EF%BC%89%E6%B5%81%E7%A8%8B%E5%9C%96%E8%BD%89%EF%BC%88MakeCode%EF%BC%89%E7%A8%8B%E5%BC%8F.docx#_ftn2" name="_ftnref2" style="mso-footnote-id: ftn2;" title=""><span class="MsoFootnoteReference"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><span style="mso-special-character: footnote;"><!--[if !supportFootnotes]--><span class="MsoFootnoteReference"><span lang="EN-US" style="font-family: "Times New Roman",serif; font-size: 12pt; mso-ansi-language: EN-US; mso-bidi-font-size: 11.0pt; mso-bidi-language: AR-SA; mso-fareast-font-family: 標楷體; mso-fareast-language: ZH-TW;">[</span></span><!--[endif]--></span></span></span></a>2]<span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">並將之另存到本機資料夾的根目錄之下(文後皆以</span><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> <span lang="EN-US">d:\ </span></span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">為例),</span><!--[if supportFields]><span lang=EN-US
style='font-family:"Times New Roman",serif;mso-fareast-font-family:標楷體'><span
style='mso-element:field-begin'></span> REF _Ref111870790 \h <span
style='mso-element:field-separator'></span></span><![endif]--><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">圖</span><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> <span lang="EN-US" style="mso-no-proof: yes;">3</span><span lang="EN-US"><!--[if gte mso 9]><xml>
<w:data>08D0C9EA79F9BACE118C8200AA004BA90B02000000080000000E0000005F005200650066003100310031003800370030003700390030000000</w:data>
</xml><![endif]--></span></span><!--[if supportFields]><span lang=EN-US
style='font-family:"Times New Roman",serif;mso-fareast-font-family:標楷體'><span
style='mso-element:field-end'></span></span><![endif]--><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">。</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><o:p></o:p></span></p>
<p align="center" class="MsoNormal" style="margin-left: 15pt; mso-char-indent-count: -1.25; text-align: center; text-indent: -15pt;"><!--[if supportFields]><span
lang=EN-US style='font-family:"Times New Roman",serif;mso-fareast-font-family:
標楷體'><span style='mso-element:field-begin'></span><span
style='mso-spacerun:yes'> </span>REF _Ref111645011 \h<span
style='mso-spacerun:yes'> </span>\* MERGEFORMAT <span style='mso-element:field-separator'></span></span><![endif]--></p><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFOTk4xDyiLEDYO80mVJa8Zhjnh0dCBkglyLAOkUHCKpw3VtVIq5AyNdA7XiE56b8HzLC7SRn6J8g0aqIsS7_qEVj4FGrSnaHU8uirAuWnonbg84fbArBXHLEYJRFc6kF7W7o4t4bh2cgt5PLebt6f7RnbLSCwFmWaqFRaPZEKvwwlBfpHr7wo6w/s705/1a.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="271" data-original-width="705" height="246" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFOTk4xDyiLEDYO80mVJa8Zhjnh0dCBkglyLAOkUHCKpw3VtVIq5AyNdA7XiE56b8HzLC7SRn6J8g0aqIsS7_qEVj4FGrSnaHU8uirAuWnonbg84fbArBXHLEYJRFc6kF7W7o4t4bh2cgt5PLebt6f7RnbLSCwFmWaqFRaPZEKvwwlBfpHr7wo6w/w640-h246/1a.jpg" width="640" /></a></div><div style="text-align: center;"><span lang="EN-US" style="font-family: "Times New Roman",serif; font-size: x-small; mso-fareast-font-family: 標楷體;">(a)</span></div><p></p><p align="center" class="MsoNormal" style="margin-left: 15pt; mso-char-indent-count: -1.25; text-align: center; text-indent: -15pt;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">
<br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhyQ89bu9vbp8exlkAfmgDv3eRIaSa2Y0-h8gZBG1s6AP5uZtrqPc0mk_OgpGCfVzyWq8IN_lqfkvysonO82rXDLFNOoTPLnyWsw8SkextEQX-RBZPirk0K6QjSU5fTTC3Rr-JsL17denk4FqLqfRuYhbgkFmbaQ8dHaqw02G8NxXxacPZVv7bd4g/s1157/1b.jpg" style="font-family: "Times New Roman"; margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="590" data-original-width="1157" height="326" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhyQ89bu9vbp8exlkAfmgDv3eRIaSa2Y0-h8gZBG1s6AP5uZtrqPc0mk_OgpGCfVzyWq8IN_lqfkvysonO82rXDLFNOoTPLnyWsw8SkextEQX-RBZPirk0K6QjSU5fTTC3Rr-JsL17denk4FqLqfRuYhbgkFmbaQ8dHaqw02G8NxXxacPZVv7bd4g/w640-h326/1b.jpg" width="640" /></a></span></p><div style="text-align: center;"><span lang="EN-US" style="font-family: "Times New Roman",serif; font-size: x-small; mso-fareast-font-family: 標楷體;">(b)</span></div><p></p><p align="center" class="MsoNormal" style="margin-left: 15pt; mso-char-indent-count: -1.25; text-align: center; text-indent: -15pt;"><br /></p><p align="center" class="MsoNormal" style="margin-left: 15pt; mso-char-indent-count: -1.25; text-align: center; text-indent: -15pt;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkcVfZkajdYR-hXV3YJWviJsuh0zqx3okvHnJXIm6zUjgcoSXVZD8RB7a_eRgF987LpN65VXaiiC4tS02Z1toBkAiQ6pZXnZXgdDXVLrmgvJikQQutqXJQm3qXZnJL_XMxLT9q-osAK5BK9EVHMJRD6UL-M5xouXp2jl8JQAZ4Lgudqr9LC94E-Q/s765/1c.jpg" style="font-family: "Times New Roman", serif; margin-left: 1em; margin-right: 1em; text-indent: -15pt;"><img border="0" data-original-height="616" data-original-width="765" height="258" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkcVfZkajdYR-hXV3YJWviJsuh0zqx3okvHnJXIm6zUjgcoSXVZD8RB7a_eRgF987LpN65VXaiiC4tS02Z1toBkAiQ6pZXnZXgdDXVLrmgvJikQQutqXJQm3qXZnJL_XMxLT9q-osAK5BK9EVHMJRD6UL-M5xouXp2jl8JQAZ4Lgudqr9LC94E-Q/s320/1c.jpg" width="320" /></a></p><p align="center" class="MsoNormal" style="margin-left: 15pt; mso-char-indent-count: -1.25; text-align: center; text-indent: -15pt;"></p><div style="text-align: center;"><span style="font-family: Times New Roman, serif; font-size: x-small;">(c)</span></div><p></p><p align="center" class="MsoNormal" style="margin-left: 15pt; mso-char-indent-count: -1.25; text-align: center; text-indent: -15pt;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><a name="_Ref111645011">
<br /></a><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnvkRrSrZm6sNXSz2qFK2iUSPxS81dTPhUzcNYOHSLmWSAQ81mHRrzUWDF8Co0Ya4XrnszyBA0Q0-pn2K3hfhmUrPE4qm3LzpkOvMsdQXZMNzCgNw6H9XpIjhNbr6HRO1m2_zezhfGVhKwAJaQwNxPJ5capoCaBAg00at69l6a7UM3j7CJVQXFnw/s765/1c.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="616" data-original-width="765" height="516" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnvkRrSrZm6sNXSz2qFK2iUSPxS81dTPhUzcNYOHSLmWSAQ81mHRrzUWDF8Co0Ya4XrnszyBA0Q0-pn2K3hfhmUrPE4qm3LzpkOvMsdQXZMNzCgNw6H9XpIjhNbr6HRO1m2_zezhfGVhKwAJaQwNxPJ5capoCaBAg00at69l6a7UM3j7CJVQXFnw/w640-h516/1c.jpg" width="640" /></a><br /></span></p><p align="center" class="MsoNormal" style="margin-left: 15pt; mso-char-indent-count: -1.25; text-align: center; text-indent: -15pt;"></p><div style="text-align: center;"><span style="font-size: x-small;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><a name="_Ref111645011">
(d)<br /></a></span><a name="_Ref111870790"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">圖</span></a><span style="mso-bookmark: _Ref111870790;"><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> </span></span><!--[if supportFields]><span
style='mso-bookmark:_Ref111870790'></span><span style='mso-element:field-begin'></span><span
style='mso-bookmark:_Ref111870790'><span lang=EN-US style='font-family:"Times New Roman",serif;
mso-fareast-font-family:標楷體'><span style='mso-spacerun:yes'> </span>SEQ </span></span><span
style='mso-bookmark:_Ref111870790'><span style='font-family:標楷體;mso-ascii-font-family:
"Times New Roman";mso-hansi-font-family:"Times New Roman";mso-bidi-font-family:
"Times New Roman"'>圖</span></span><span style='mso-bookmark:_Ref111870790'><span
lang=EN-US style='font-family:"Times New Roman",serif;mso-fareast-font-family:
標楷體'> \* ARABIC <span style='mso-element:field-separator'></span></span></span><![endif]--><span style="mso-bookmark: _Ref111870790;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><span style="mso-no-proof: yes;">3</span></span></span><!--[if supportFields]><span
style='mso-bookmark:_Ref111870790'></span><span style='mso-element:field-end'></span><![endif]--><span style="mso-bookmark: _Ref111870790;"></span><span style="mso-bookmark: _Ref111870790;"></span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">:下載「</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">04-01.</span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">前測</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">_</span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">顯示</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">5</span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">次</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">Hi.fpp</span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">」</span></span></div><p></p>
<p align="center" class="MsoNormal" style="text-align: center;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><o:p> </o:p></span></p>
<p class="MsoNormal" style="text-align: justify; text-justify: inter-ideograph;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">2. </span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">連入</span><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> <span lang="EN-US">fChart </span></span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">英文版的載點</span><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> </span><span lang="EN-US"><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體; outline-width: 0px !important; user-select: auto !important;"><a href="https://reurl.cc/9pVEEO" target="_blank">https://reurl.cc/9pVEEO</a></span></span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">,將壓縮檔「</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">fChartPython6_en.zip</span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">」下載到本機儲存</span><a href="https://d.docs.live.net/f89b2e10c0c5aa13/Writing/%E8%B3%87%E8%A8%8A%E5%AD%B8%E7%A7%91%E4%B8%AD%E5%BF%83/%EF%BC%88fChart%EF%BC%89%E6%B5%81%E7%A8%8B%E5%9C%96%E8%BD%89%EF%BC%88MakeCode%EF%BC%89%E7%A8%8B%E5%BC%8F/%EF%BC%88fChart%EF%BC%89%E6%B5%81%E7%A8%8B%E5%9C%96%E8%BD%89%EF%BC%88MakeCode%EF%BC%89%E7%A8%8B%E5%BC%8F.docx#_ftn3" name="_ftnref3" style="mso-footnote-id: ftn3;" title=""><span class="MsoFootnoteReference"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><span style="mso-special-character: footnote;"><!--[if !supportFootnotes]--><span class="MsoFootnoteReference"><span lang="EN-US" style="font-family: "Times New Roman",serif; font-size: 12pt; mso-ansi-language: EN-US; mso-bidi-font-size: 11.0pt; mso-bidi-language: AR-SA; mso-fareast-font-family: 標楷體; mso-fareast-language: ZH-TW;">[</span></span><!--[endif]--></span></span></span></a>3]<span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">後將之解壓縮(要解到「根」目錄下以防止有中文徑名問題),</span><!--[if supportFields]><span
lang=EN-US style='font-family:"Times New Roman",serif;mso-fareast-font-family:
標楷體'><span style='mso-element:field-begin'></span> REF _Ref111707033 \h <span
style='mso-spacerun:yes'> </span>\* MERGEFORMAT <span style='mso-element:field-separator'></span></span><![endif]--><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">圖</span><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> <span lang="EN-US" style="mso-no-proof: yes;">4</span><span lang="EN-US"><!--[if gte mso 9]><xml>
<w:data>08D0C9EA79F9BACE118C8200AA004BA90B02000000080000000E0000005F005200650066003100310031003700300037003000330033000000</w:data>
</xml><![endif]--></span></span><!--[if supportFields]><span lang=EN-US
style='font-family:"Times New Roman",serif;mso-fareast-font-family:標楷體'><span
style='mso-element:field-end'></span></span><![endif]--><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">。</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><o:p></o:p></span></p>
<p class="MsoNormal" style="text-align: justify; text-justify: inter-ideograph;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><o:p> </o:p></span></p>
<p align="center" class="MsoNormal" style="break-after: avoid; page-break-after: avoid; text-align: center;"></p><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjovbacE8TH_6CF6XJXr8T89XgMWPTyQj80LnuxQ5w9XhM_GiWTvDQ9kCC-ekc6p8iiW7MO-1rdSf2eSQXPBosI6XTgaIn5YzQ_UW2xe5yrtUDymjBtaxN3ccTwS_zBviPO9GxXfLynQxIyusmtdQZ4hzyRRGduprh2PLMrER-3zi6G20ygJH_kXQ/s1223/2a.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="329" data-original-width="1223" height="172" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjovbacE8TH_6CF6XJXr8T89XgMWPTyQj80LnuxQ5w9XhM_GiWTvDQ9kCC-ekc6p8iiW7MO-1rdSf2eSQXPBosI6XTgaIn5YzQ_UW2xe5yrtUDymjBtaxN3ccTwS_zBviPO9GxXfLynQxIyusmtdQZ4hzyRRGduprh2PLMrER-3zi6G20ygJH_kXQ/w640-h172/2a.jpg" width="640" /></a></div><div style="text-align: center;"><span lang="EN-US" style="font-family: "Times New Roman",serif; font-size: x-small; mso-fareast-font-family: 標楷體;">
(a)</span></div><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">
<br /><div style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6SGipAi6gJrnqC84-kIKGDw6vA2Qn0E9yyd5zwQn7xIm3LghPYYi-nhENKVlIP3ydBbUu2DIFoK80FotYa3c-7LPbqlEPA6LFR-NjZ_ssFoTTq0UKJeyfEWZSm7fnAMvqOUL6US0QkZTnbRPZslYCXVStL0KTHJpSp0vL-ffw_wcE4W60igtlgw/s501/2b.jpg" style="font-family: "Times New Roman"; margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="263" data-original-width="501" height="168" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6SGipAi6gJrnqC84-kIKGDw6vA2Qn0E9yyd5zwQn7xIm3LghPYYi-nhENKVlIP3ydBbUu2DIFoK80FotYa3c-7LPbqlEPA6LFR-NjZ_ssFoTTq0UKJeyfEWZSm7fnAMvqOUL6US0QkZTnbRPZslYCXVStL0KTHJpSp0vL-ffw_wcE4W60igtlgw/s320/2b.jpg" width="320" /></a></div></span><div style="text-align: center;"><span lang="EN-US" style="font-family: "Times New Roman",serif; font-size: x-small; mso-fareast-font-family: 標楷體;">
(b)</span></div><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">
<br /><div style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitH6EsXK11ckWirso1IV_s2H-piSxuLBA7VWdx141cJxoVGqO4pifE9qhmIObp1UivoQOLQZISNuZ2d54-XUK8TUw5VpYo33lwf4e-wT0XIJNrkhh7D8mRdgVkSotBESY35E3ig7AQye3HiZZfn7Z3lMaGUYoLKTl3Gw9nzlpxIl1CeYEkpc16gg/s1014/2c.jpg" style="font-family: "Times New Roman"; margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="634" data-original-width="1014" height="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitH6EsXK11ckWirso1IV_s2H-piSxuLBA7VWdx141cJxoVGqO4pifE9qhmIObp1UivoQOLQZISNuZ2d54-XUK8TUw5VpYo33lwf4e-wT0XIJNrkhh7D8mRdgVkSotBESY35E3ig7AQye3HiZZfn7Z3lMaGUYoLKTl3Gw9nzlpxIl1CeYEkpc16gg/s320/2c.jpg" width="320" /></a></div></span><div style="text-align: center;"><span lang="EN-US" style="font-family: "Times New Roman",serif; font-size: x-small; mso-fareast-font-family: 標楷體;">
(c)</span></div><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">
<br /><div style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjsuGDRAby0KWyWBzPB_VotG6VnpF0VleDfRUN6B1yLAmDul2OwFWMgeBnKP-VzvJrf2wVxGKYuTn4eckBAbmHr-Uhl2oh2DhST5hOIpgkJS5VZWfV4ybHjZIhoN5kWwt5JEIxjOL4aYmvUyMFdgEKS_MupxI82RyGjoyC9oSNzS6RTRgnG3dk-mg/s892/2d.jpg" style="font-family: "Times New Roman"; margin-left: 1em; margin-right: 1em; outline-width: 0px; user-select: auto;"><img border="0" data-original-height="834" data-original-width="892" height="598" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjsuGDRAby0KWyWBzPB_VotG6VnpF0VleDfRUN6B1yLAmDul2OwFWMgeBnKP-VzvJrf2wVxGKYuTn4eckBAbmHr-Uhl2oh2DhST5hOIpgkJS5VZWfV4ybHjZIhoN5kWwt5JEIxjOL4aYmvUyMFdgEKS_MupxI82RyGjoyC9oSNzS6RTRgnG3dk-mg/w640-h598/2d.jpg" width="640" /></a></div></span><div style="text-align: center;"><span lang="EN-US" style="font-family: "Times New Roman",serif; font-size: x-small; mso-fareast-font-family: 標楷體;">
(d)</span></div><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">
<br /><div style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgc6DTF8hMq6A2sEGDgzEmPZ9dG3YxYFOFDmmy1Q1MbsLeKgq3psm6nb63f5VQpDQAc4tEDBVD_NmUbATt5IMVDWaH9zm2sfXeppAnyhCM9BFgSZ_l9Xn-mdAcHWWaWTYaNgiGf4PaE89oqrMlQZ9hm28XTWV2YW677QLfuN4hkRc40Y2x05JW_Ig/s709/2e.jpg" style="font-family: "Times New Roman"; margin-left: 1em; margin-right: 1em; outline-width: 0px; user-select: auto;"><img border="0" data-original-height="515" data-original-width="709" height="464" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgc6DTF8hMq6A2sEGDgzEmPZ9dG3YxYFOFDmmy1Q1MbsLeKgq3psm6nb63f5VQpDQAc4tEDBVD_NmUbATt5IMVDWaH9zm2sfXeppAnyhCM9BFgSZ_l9Xn-mdAcHWWaWTYaNgiGf4PaE89oqrMlQZ9hm28XTWV2YW677QLfuN4hkRc40Y2x05JW_Ig/w640-h464/2e.jpg" width="640" /></a></div></span><div style="text-align: center;"><span lang="EN-US" style="font-family: "Times New Roman",serif; font-size: x-small; mso-fareast-font-family: 標楷體;">
(e)</span></div><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">
<br /><div style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5qIb6qN8BZTnjgpj6tWNiBd9CJ8aBaeLLb2PbD8ahtlZJyrZ9LXlI3ddSaAe0JXxTsNUtYK_kgCAUgQeAiJMztpbz6UaXRCDtOThnFub0Iy-zopK_QRaWU14gutuAlxPbjmKCLlFVDmOse4fJf5OqHFbjuQqU18PPaTrd8DjPjoASTfbEGUK9Uw/s862/2f.jpg" style="font-family: "Times New Roman"; margin-left: 1em; margin-right: 1em; outline-width: 0px; user-select: auto;"><img border="0" data-original-height="862" data-original-width="657" height="640" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5qIb6qN8BZTnjgpj6tWNiBd9CJ8aBaeLLb2PbD8ahtlZJyrZ9LXlI3ddSaAe0JXxTsNUtYK_kgCAUgQeAiJMztpbz6UaXRCDtOThnFub0Iy-zopK_QRaWU14gutuAlxPbjmKCLlFVDmOse4fJf5OqHFbjuQqU18PPaTrd8DjPjoASTfbEGUK9Uw/w488-h640/2f.jpg" width="488" /></a></div></span><div style="text-align: center;"><span lang="EN-US" style="font-family: "Times New Roman",serif; font-size: x-small; mso-fareast-font-family: 標楷體;">
(f)</span></div><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><br /><div style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbAD-Tv6UzfXESfNnX3YCpoKLTU1IfwC20DvR-gFmkvqvQS3Hdo8NeIG4ZvTc5ijHCkObB6SBreIWX1B5Yo5Okwvdht-3oml1LfImX83RilOTnknqG2H_8necgHIWpDdJaPpjhGZKlpRyjz33LGSQBSUicpIPkN48OpUcV890ox7eOIAaXE8gEIA/s990/2g.jpg" style="font-family: "Times New Roman"; margin-left: 1em; margin-right: 1em; outline-width: 0px; user-select: auto;"><img border="0" data-original-height="750" data-original-width="990" height="484" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbAD-Tv6UzfXESfNnX3YCpoKLTU1IfwC20DvR-gFmkvqvQS3Hdo8NeIG4ZvTc5ijHCkObB6SBreIWX1B5Yo5Okwvdht-3oml1LfImX83RilOTnknqG2H_8necgHIWpDdJaPpjhGZKlpRyjz33LGSQBSUicpIPkN48OpUcV890ox7eOIAaXE8gEIA/w640-h484/2g.jpg" width="640" /></a></div><div style="text-align: center;"><span style="font-size: small;">(g)</span></div></span><div class="separator" style="clear: both; text-align: center;"><span style="font-size: x-small;"><a name="_Ref111707033"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">圖</span></a><span style="mso-bookmark: _Ref111707033;"><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> </span></span><!--[if supportFields]><span
style='mso-bookmark:_Ref111707033'></span><span style='mso-element:field-begin'></span><span
style='mso-bookmark:_Ref111707033'><span lang=EN-US style='font-family:"Times New Roman",serif;
mso-fareast-font-family:標楷體'><span style='mso-spacerun:yes'> </span>SEQ </span></span><span
style='mso-bookmark:_Ref111707033'><span style='font-family:標楷體;mso-ascii-font-family:
"Times New Roman";mso-hansi-font-family:"Times New Roman";mso-bidi-font-family:
"Times New Roman"'>圖</span></span><span style='mso-bookmark:_Ref111707033'><span
lang=EN-US style='font-family:"Times New Roman",serif;mso-fareast-font-family:
標楷體'> \* ARABIC <span style='mso-element:field-separator'></span></span></span><![endif]--><span style="mso-bookmark: _Ref111707033;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><span style="mso-no-proof: yes;">4</span></span></span><!--[if supportFields]><span
style='mso-bookmark:_Ref111707033'></span><span style='mso-element:field-end'></span><![endif]--><span style="mso-bookmark: _Ref111707033;"></span><span style="mso-bookmark: _Ref111707033;"></span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">:下載「</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">fChartPython6_en.zip</span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">」並將之解壓縮到</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> d:\ </span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">後執行「</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">FlowProgramming_Edit.exe</span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">」</span></span></div><p></p>
<p class="MsoNormal" style="text-align: justify; text-justify: inter-ideograph;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><o:p> </o:p></span></p>
<p class="MsoNormal" style="text-align: justify; text-justify: inter-ideograph;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">3. </span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">在「</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">fChart Interpreter 6.00</span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">」中開啟「</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">04-01.</span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">前測</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">_</span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">顯示</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">5</span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">次</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">Hi.fpp</span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">」</span><a href="https://d.docs.live.net/f89b2e10c0c5aa13/Writing/%E8%B3%87%E8%A8%8A%E5%AD%B8%E7%A7%91%E4%B8%AD%E5%BF%83/%EF%BC%88fChart%EF%BC%89%E6%B5%81%E7%A8%8B%E5%9C%96%E8%BD%89%EF%BC%88MakeCode%EF%BC%89%E7%A8%8B%E5%BC%8F/%EF%BC%88fChart%EF%BC%89%E6%B5%81%E7%A8%8B%E5%9C%96%E8%BD%89%EF%BC%88MakeCode%EF%BC%89%E7%A8%8B%E5%BC%8F.docx#_ftn4" name="_ftnref4" style="mso-footnote-id: ftn4;" title=""><span class="MsoFootnoteReference"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><span style="mso-special-character: footnote;"><!--[if !supportFootnotes]--><span class="MsoFootnoteReference"><span lang="EN-US" style="font-family: "Times New Roman",serif; font-size: 12pt; mso-ansi-language: EN-US; mso-bidi-font-size: 11.0pt; mso-bidi-language: AR-SA; mso-fareast-font-family: 標楷體; mso-fareast-language: ZH-TW;">[</span></span><!--[endif]--></span></span></span></a>4]<span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">,</span><!--[if supportFields]><span
lang=EN-US style='font-family:"Times New Roman",serif;mso-fareast-font-family:
標楷體'><span style='mso-element:field-begin'></span> REF _Ref111709383 \h <span
style='mso-spacerun:yes'> </span>\* MERGEFORMAT <span style='mso-element:field-separator'></span></span><![endif]--><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">圖</span><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> <span lang="EN-US" style="mso-no-proof: yes;">5</span><span lang="EN-US"><!--[if gte mso 9]><xml>
<w:data>08D0C9EA79F9BACE118C8200AA004BA90B02000000080000000E0000005F005200650066003100310031003700300039003300380033000000</w:data>
</xml><![endif]--></span></span><!--[if supportFields]><span lang=EN-US
style='font-family:"Times New Roman",serif;mso-fareast-font-family:標楷體'><span
style='mso-element:field-end'></span></span><![endif]--><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">。</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><o:p></o:p></span></p>
<p class="MsoNormal" style="text-align: justify; text-justify: inter-ideograph;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><o:p> </o:p></span></p>
<p align="center" class="MsoNormal" style="break-after: avoid; page-break-after: avoid; text-align: center;"></p><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjeTyXexftYkQSaeyD7s0maBAva6JqxtmMr9e1oSeYBVa7SdK7LojsbK83P32Ut0DnpLZ4Q1AGXYHJMgT6c-PCSj9lIIkjM-33l-pHLKCz_wa0KrtRE3sWlA--t7-7jzUjjp3AmEgFgarenC0iudPYvFmFm0QeL8Vya58sVbmddCYhntQRmP1NkeA/s309/3a.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="165" data-original-width="309" height="165" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjeTyXexftYkQSaeyD7s0maBAva6JqxtmMr9e1oSeYBVa7SdK7LojsbK83P32Ut0DnpLZ4Q1AGXYHJMgT6c-PCSj9lIIkjM-33l-pHLKCz_wa0KrtRE3sWlA--t7-7jzUjjp3AmEgFgarenC0iudPYvFmFm0QeL8Vya58sVbmddCYhntQRmP1NkeA/s1600/3a.jpg" width="309" /></a></div><div style="text-align: center;"><span lang="EN-US" style="font-family: "Times New Roman",serif; font-size: x-small; mso-fareast-font-family: 標楷體;">
(a)</span></div><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoUh6xrTJnFInPwokHvDWV9V4QM_tju5s9ZlEFX-k3kLY1wCJDrt7Akgbz_B4PQO-wAJlvDx92ssHEpOz9DOQrIHKLJGM6AqS-JJwcXTyAZxO-BF0NvS563pOEWxudjDDw-PO8ZpNjB63YwzNxmjSY_ZxaCFwvNPikUhpd2sWPbqINOM1ZOX6NxQ/s763/3b.jpg" style="font-family: "Times New Roman"; margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="502" data-original-width="763" height="422" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoUh6xrTJnFInPwokHvDWV9V4QM_tju5s9ZlEFX-k3kLY1wCJDrt7Akgbz_B4PQO-wAJlvDx92ssHEpOz9DOQrIHKLJGM6AqS-JJwcXTyAZxO-BF0NvS563pOEWxudjDDw-PO8ZpNjB63YwzNxmjSY_ZxaCFwvNPikUhpd2sWPbqINOM1ZOX6NxQ/w640-h422/3b.jpg" width="640" /></a><br /></span><div style="text-align: center;"><span lang="EN-US" style="font-family: "Times New Roman",serif; font-size: x-small; mso-fareast-font-family: 標楷體;">
(b)</span></div><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">
<br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYjf9Qs8kYn_QDQ_Q9AGi36PsQQ9YM61MUX5IX-sq2skoWL5nhGYfWRdPa6AVocXeE94HL_M42eejQkMajCehyonwRI5X7aQnqyfxRlRnLiVlZM9X1C_C8sRG0V9EIJBy0cglxkndjhkBpVV0S2K7Lq3T3YwrqjQ8n-Ahcq4Q_uqGiUajEWQnaoQ/s990/3c.jpg" style="font-family: "Times New Roman"; margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="750" data-original-width="990" height="484" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYjf9Qs8kYn_QDQ_Q9AGi36PsQQ9YM61MUX5IX-sq2skoWL5nhGYfWRdPa6AVocXeE94HL_M42eejQkMajCehyonwRI5X7aQnqyfxRlRnLiVlZM9X1C_C8sRG0V9EIJBy0cglxkndjhkBpVV0S2K7Lq3T3YwrqjQ8n-Ahcq4Q_uqGiUajEWQnaoQ/w640-h484/3c.jpg" width="640" /></a><br /><div style="text-align: center;"><span style="font-size: small;">(c)</span></div></span><div class="separator" style="clear: both; text-align: center;"><span style="font-size: x-small;"><a name="_Ref111709383"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">圖</span></a><span style="mso-bookmark: _Ref111709383;"><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> </span></span><!--[if supportFields]><span
style='mso-bookmark:_Ref111709383'></span><span style='mso-element:field-begin'></span><span
style='mso-bookmark:_Ref111709383'><span lang=EN-US style='font-family:"Times New Roman",serif;
mso-fareast-font-family:標楷體'><span style='mso-spacerun:yes'> </span>SEQ </span></span><span
style='mso-bookmark:_Ref111709383'><span style='font-family:標楷體;mso-ascii-font-family:
"Times New Roman";mso-hansi-font-family:"Times New Roman";mso-bidi-font-family:
"Times New Roman"'>圖</span></span><span style='mso-bookmark:_Ref111709383'><span
lang=EN-US style='font-family:"Times New Roman",serif;mso-fareast-font-family:
標楷體'> \* ARABIC <span style='mso-element:field-separator'></span></span></span><![endif]--><span style="mso-bookmark: _Ref111709383;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><span style="mso-no-proof: yes;">5</span></span></span><!--[if supportFields]><span
style='mso-bookmark:_Ref111709383'></span><span style='mso-element:field-end'></span><![endif]--><span style="mso-bookmark: _Ref111709383;"></span><span style="mso-bookmark: _Ref111709383;"></span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">:在</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> fChart </span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">直譯器中開啟「</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">04-01.</span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">前測</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">_</span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">顯示</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">5</span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">次</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">Hi.fpp</span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">」</span></span></div>
<h2><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">變數監看</span> <span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">+</span>
<span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">單步執行</span><span lang="EN-US"><o:p></o:p></span></h2>
<p class="MsoNormal" style="mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">程式設計能力的培養分成兩部份:讀和寫,而在深入這兩種練習之前,我們十分建議初學者善用</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> fChart </span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">的程式執行流程追蹤功能建立兩層面的<b>直覺(</b></span><b><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">intuition</span></b><b><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">)</span></b><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">:<b><span style="color: red;">觀察(</span></b></span><b><span lang="EN-US" style="color: red; font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">observation</span></b><b><span face="標楷體" style="color: red; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">)</span></b><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">與<b><span style="color: red;">手動控制(</span></b></span><b><span lang="EN-US" style="color: red; font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">manual control</span></b><b><span face="標楷體" style="color: red; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">)</span></b><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">。我們以下列的步驟</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> 4~6 </span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">來詳細分述之:</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><o:p></o:p></span></p>
<p class="MsoNormal" style="text-align: justify; text-justify: inter-ideograph;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><o:p> </o:p></span></p>
<p class="MsoNormal" style="text-align: justify; text-justify: inter-ideograph;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">4. </span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">在</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> fChart </span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">上方的執行控制工具列(</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">fChart Execution Toolbar</span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">)上按下執行(</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">execute</span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">)按鈕<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4sT9e_Xt0_8zK-GclWVr_lZIvTAQg9XJgKl8p5DuNa7dq5nmdW0rk47fwo7pWSSufuaaiUZ3Ie-ztAcjYN4HcKb4fXMzw9u2UrHK6Mn3BFQoYzzoUr7IoaO2or0-EFyYhlZVLqUXUjTaajkGUGwrZ_b7V4eh_wvMTIlzVrWFm2QnbSvzmPHoWSQ/s48/4a.jpg" style="font-family: "Times New Roman", serif; margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" data-original-height="37" data-original-width="48" height="37" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4sT9e_Xt0_8zK-GclWVr_lZIvTAQg9XJgKl8p5DuNa7dq5nmdW0rk47fwo7pWSSufuaaiUZ3Ie-ztAcjYN4HcKb4fXMzw9u2UrHK6Mn3BFQoYzzoUr7IoaO2or0-EFyYhlZVLqUXUjTaajkGUGwrZ_b7V4eh_wvMTIlzVrWFm2QnbSvzmPHoWSQ/s1600/4a.jpg" width="48" /></a></span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">,觀察流程圖動態執行及結果輸出的過程來體會迴圈重複執行的<b>迭代(</b></span><b><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">iteration</span></b><b><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">)</span></b><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">。</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><o:p></o:p></span></p>
<p class="MsoNormal" style="text-align: justify; text-justify: inter-ideograph;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">5. </span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">按下變數監看視窗啟動按鈕<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWIc_2V4jHQLEFAgy-Y-lJz8XXCM4-tHCOuuOK3IOmdAxf2f0xDDh7h_NfrTSG-rg75ScAdQJLorXSzyNJu0QEXxbX_7YAwgZCFIKoAKvZl358w9XEvxFXf2UjzG6c2V6QEEgC7RU1jYe570t9RVnO8xwEDWx2vA-X0-FjmFxVqhsIssNWk8nZ5A/s73/4b.jpg" style="margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" data-original-height="38" data-original-width="73" height="38" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWIc_2V4jHQLEFAgy-Y-lJz8XXCM4-tHCOuuOK3IOmdAxf2f0xDDh7h_NfrTSG-rg75ScAdQJLorXSzyNJu0QEXxbX_7YAwgZCFIKoAKvZl358w9XEvxFXf2UjzG6c2V6QEEgC7RU1jYe570t9RVnO8xwEDWx2vA-X0-FjmFxVqhsIssNWk8nZ5A/s1600/4b.jpg" width="73" /></a></span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">後,我們可以進一步觀察到流程圖在重複輸出字串時,迴圈控制變數</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> a </span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">的變化過程(由</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> 1 </span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">一直跑到</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> 5</span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">)。</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><o:p></o:p></span></p>
<p class="MsoNormal" style="text-align: justify; text-justify: inter-ideograph;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><o:p> </o:p></span></p>
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhncBSLEQLeOgGPk8CzkVoIwXgytIYpU4lLGQoV1bnkE_5iXO2cJV_5ofh6GBppePM3e16aOQXssIEIm_XTsITsKcDRdZHGNz2PdluLTYGNIuCi6YJu1pc9tlduTHtqxEV4nRAG7FlV-brpLjkAb-c_9SV6KSed6xm7LLcvcRa38mK-tZabcwdf4A/s868/6.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="474" data-original-width="868" height="350" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhncBSLEQLeOgGPk8CzkVoIwXgytIYpU4lLGQoV1bnkE_5iXO2cJV_5ofh6GBppePM3e16aOQXssIEIm_XTsITsKcDRdZHGNz2PdluLTYGNIuCi6YJu1pc9tlduTHtqxEV4nRAG7FlV-brpLjkAb-c_9SV6KSed6xm7LLcvcRa38mK-tZabcwdf4A/w640-h350/6.jpg" width="640" /></a></div><div style="break-after: avoid; text-align: center;"><span style="font-size: x-small;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">圖</span><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> </span><!--[if supportFields]><span
lang=EN-US style='font-family:"Times New Roman",serif;mso-fareast-font-family:
標楷體'><span style='mso-element:field-begin'></span><span
style='mso-spacerun:yes'> </span>SEQ </span><span style='font-family:標楷體;
mso-ascii-font-family:"Times New Roman";mso-hansi-font-family:"Times New Roman";
mso-bidi-font-family:"Times New Roman"'>圖</span><span lang=EN-US
style='font-family:"Times New Roman",serif;mso-fareast-font-family:標楷體'> \*
ARABIC <span style='mso-element:field-separator'></span></span><![endif]--><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><span style="mso-no-proof: yes;">6</span></span><!--[if supportFields]><span
lang=EN-US style='font-family:"Times New Roman",serif;mso-fareast-font-family:
標楷體'><span style='mso-element:field-end'></span></span><![endif]--><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">:變數監看</span></span></div>
<p class="MsoNormal" style="text-align: justify; text-justify: inter-ideograph;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><o:p> </o:p></span></p>
<p class="MsoNormal" style="text-align: justify; text-justify: inter-ideograph;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">6. </span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">將延遲時間<b>滑桿(</b></span><b><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">slider</span></b><b><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">)</span></b><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2rCfJ-fU_rWjMKGrIILBy9tT07jvZzRJ5_t3eQmeBEkHZxONPfjuPQJRK_xz7SkpQ8MIdDP1rYW_UKiY0y2lnWAdYrMZvnkQMJo_0BsfAhhjtGpTRKyP3nbI-RAMNhmImnkgiecHhx4JLNYf17SGOq_rdKz8VBIj2HQ_FL4u2vE63uUvcgQ48jg/s120/6a.jpg" style="font-family: "Times New Roman", serif; font-weight: bold; margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" data-original-height="36" data-original-width="120" height="36" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2rCfJ-fU_rWjMKGrIILBy9tT07jvZzRJ5_t3eQmeBEkHZxONPfjuPQJRK_xz7SkpQ8MIdDP1rYW_UKiY0y2lnWAdYrMZvnkQMJo_0BsfAhhjtGpTRKyP3nbI-RAMNhmImnkgiecHhx4JLNYf17SGOq_rdKz8VBIj2HQ_FL4u2vE63uUvcgQ48jg/s1600/6a.jpg" width="120" /></a><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">往「右」打到底即可讓</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> fChart
</span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">進入單步執行模式。此時可以搭配控制按鈕<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNIMhfFUnUo3uAt-dxSdqbJsxYgP-JNdzJzlWj7uVygkkJtM4oo2xx4GPG_RuxOpl2fSxrHulK0bEcQM3wJy8RTySW-p7Vn72RWtNoMfsfdhgWHFO30wCK67juhdh66zdCkZqzuhbmgKEb2z6EsPw_e65GWZe9P5T2-rA0hUED2GG95WNKwlO5XQ/s45/6b.jpg" style="margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" data-original-height="35" data-original-width="45" height="35" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNIMhfFUnUo3uAt-dxSdqbJsxYgP-JNdzJzlWj7uVygkkJtM4oo2xx4GPG_RuxOpl2fSxrHulK0bEcQM3wJy8RTySW-p7Vn72RWtNoMfsfdhgWHFO30wCK67juhdh66zdCkZqzuhbmgKEb2z6EsPw_e65GWZe9P5T2-rA0hUED2GG95WNKwlO5XQ/s1600/6b.jpg" width="45" /></a></span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">,按一下執行流程圖中的一個符號,</span><!--[if supportFields]><span
lang=EN-US style='font-family:"Times New Roman",serif;mso-fareast-font-family:
標楷體'><span style='mso-element:field-begin'></span> REF _Ref111727949 \h <span
style='mso-spacerun:yes'> </span>\* MERGEFORMAT <span style='mso-element:field-separator'></span></span><![endif]--><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">圖</span><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> <span lang="EN-US" style="mso-no-proof: yes;">7</span><span lang="EN-US"><!--[if gte mso 9]><xml>
<w:data>08D0C9EA79F9BACE118C8200AA004BA90B02000000080000000E0000005F005200650066003100310031003700320037003900340039000000</w:data>
</xml><![endif]--></span></span><!--[if supportFields]><span lang=EN-US
style='font-family:"Times New Roman",serif;mso-fareast-font-family:標楷體'><span
style='mso-element:field-end'></span></span><![endif]--><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">。</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><o:p></o:p></span></p>
<p class="MsoNormal" style="text-align: justify; text-justify: inter-ideograph;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><o:p> </o:p></span></p>
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiYL1MprfQjFaOZNkAEtkpCrFEKDsnbnmNSXFGyasU9_PIlv059fd9OLoFkkEsis-xzFOXizflksZYMjIsXNgeJWwbwVmU4gbbrVsKMjzne8oBiZQFTgrZI-_PzsLi5-SQMzuguty3fkBzPVhjwYyeKOUBahFa-P4bGl2JPHKHEp4tvYh0zv-S0gg/s1103/7.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="585" data-original-width="1103" height="340" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiYL1MprfQjFaOZNkAEtkpCrFEKDsnbnmNSXFGyasU9_PIlv059fd9OLoFkkEsis-xzFOXizflksZYMjIsXNgeJWwbwVmU4gbbrVsKMjzne8oBiZQFTgrZI-_PzsLi5-SQMzuguty3fkBzPVhjwYyeKOUBahFa-P4bGl2JPHKHEp4tvYh0zv-S0gg/w640-h340/7.jpg" width="640" /></a></div><div style="break-after: avoid; text-align: center;"><span style="font-size: x-small;"><a name="_Ref111727949"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">圖</span></a><span style="mso-bookmark: _Ref111727949;"><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> </span></span><!--[if supportFields]><span
style='mso-bookmark:_Ref111727949'></span><span style='mso-element:field-begin'></span><span
style='mso-bookmark:_Ref111727949'><span lang=EN-US style='font-family:"Times New Roman",serif;
mso-fareast-font-family:標楷體'><span style='mso-spacerun:yes'> </span>SEQ </span></span><span
style='mso-bookmark:_Ref111727949'><span style='font-family:標楷體;mso-ascii-font-family:
"Times New Roman";mso-hansi-font-family:"Times New Roman";mso-bidi-font-family:
"Times New Roman"'>圖</span></span><span style='mso-bookmark:_Ref111727949'><span
lang=EN-US style='font-family:"Times New Roman",serif;mso-fareast-font-family:
標楷體'> \* ARABIC <span style='mso-element:field-separator'></span></span></span><![endif]--><span style="mso-bookmark: _Ref111727949;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><span style="mso-no-proof: yes;">7</span></span></span><!--[if supportFields]><span
style='mso-bookmark:_Ref111727949'></span><span style='mso-element:field-end'></span><![endif]--><span style="mso-bookmark: _Ref111727949;"></span><span style="mso-bookmark: _Ref111727949;"></span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">:單步執行</span></span></div>
<h1><span lang="EN-US">MakeCode </span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">程式</span><span lang="EN-US" style="color: black;"><o:p></o:p></span></h1>
<p class="MsoNormal" style="background: white; mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;"><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-color-alt: windowtext; mso-hansi-font-family: "Times New Roman";">本文的標是以</span><span style="color: black; font-family: "Times New Roman",serif; mso-color-alt: windowtext; mso-fareast-font-family: 標楷體;"> <span lang="EN-US">fChart </span></span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-color-alt: windowtext; mso-hansi-font-family: "Times New Roman";">來訓練</span><!--[if supportFields]><span
lang=EN-US style='font-family:"Times New Roman",serif;mso-fareast-font-family:
標楷體;color:black;mso-color-alt:windowtext'><span style='mso-element:field-begin'></span>
REF _Ref109747896 \h <span style='mso-element:field-separator'></span></span><![endif]--><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-color-alt: windowtext; mso-hansi-font-family: "Times New Roman";">圖</span><span style="color: black; font-family: "Times New Roman",serif; mso-color-alt: windowtext; mso-fareast-font-family: 標楷體;"> <span lang="EN-US" style="mso-no-proof: yes;">1</span><span lang="EN-US"><!--[if gte mso 9]><xml>
<w:data>08D0C9EA79F9BACE118C8200AA004BA90B02000000080000000E0000005F005200650066003100300039003700340037003800390036000000</w:data>
</xml><![endif]--></span></span><!--[if supportFields]><span lang=EN-US
style='font-family:"Times New Roman",serif;mso-fareast-font-family:標楷體;
color:black;mso-color-alt:windowtext'><span style='mso-element:field-end'></span></span><![endif]--><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-color-alt: windowtext; mso-fareast-font-family: 標楷體;"> </span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-color-alt: windowtext; mso-hansi-font-family: "Times New Roman";">問題解決過程的最後一段:從流程圖(</span><!--[if supportFields]><span
lang=EN-US style='font-family:"Times New Roman",serif;mso-fareast-font-family:
標楷體;color:black;mso-color-alt:windowtext'><span style='mso-element:field-begin'></span>
REF _Ref111620918 \h <span style='mso-element:field-separator'></span></span><![endif]--><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-color-alt: windowtext; mso-hansi-font-family: "Times New Roman";">圖</span><span style="color: black; font-family: "Times New Roman",serif; mso-color-alt: windowtext; mso-fareast-font-family: 標楷體;"> <span lang="EN-US" style="mso-no-proof: yes;">2</span><span lang="EN-US"><!--[if gte mso 9]><xml>
<w:data>08D0C9EA79F9BACE118C8200AA004BA90B02000000080000000E0000005F005200650066003100310031003600320030003900310038000000</w:data>
</xml><![endif]--></span></span><!--[if supportFields]><span lang=EN-US
style='font-family:"Times New Roman",serif;mso-fareast-font-family:標楷體;
color:black;mso-color-alt:windowtext'><span style='mso-element:field-end'></span></span><![endif]--><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-color-alt: windowtext; mso-hansi-font-family: "Times New Roman";">)轉換為</span><span style="color: black; font-family: "Times New Roman",serif; mso-color-alt: windowtext; mso-fareast-font-family: 標楷體;"> <span lang="EN-US">MakeCode </span></span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-color-alt: windowtext; mso-hansi-font-family: "Times New Roman";">程式</span><a href="https://d.docs.live.net/f89b2e10c0c5aa13/Writing/%E8%B3%87%E8%A8%8A%E5%AD%B8%E7%A7%91%E4%B8%AD%E5%BF%83/%EF%BC%88fChart%EF%BC%89%E6%B5%81%E7%A8%8B%E5%9C%96%E8%BD%89%EF%BC%88MakeCode%EF%BC%89%E7%A8%8B%E5%BC%8F/%EF%BC%88fChart%EF%BC%89%E6%B5%81%E7%A8%8B%E5%9C%96%E8%BD%89%EF%BC%88MakeCode%EF%BC%89%E7%A8%8B%E5%BC%8F.docx#_ftn5" name="_ftnref5" style="mso-footnote-id: ftn5;" title=""><span class="MsoFootnoteReference"><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-color-alt: windowtext; mso-fareast-font-family: 標楷體;"><span style="mso-special-character: footnote;"><!--[if !supportFootnotes]--><span class="MsoFootnoteReference"><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; font-size: 12pt; mso-ansi-language: EN-US; mso-bidi-font-size: 11.0pt; mso-bidi-language: AR-SA; mso-fareast-font-family: 標楷體; mso-fareast-language: ZH-TW;">[</span></span><!--[endif]--></span></span></span></a>5]<span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-color-alt: windowtext; mso-hansi-font-family: "Times New Roman";">。為了更清楚對照,我們將這兩者併排顯示於</span><!--[if supportFields]><span
lang=EN-US style='font-family:"Times New Roman",serif;mso-fareast-font-family:
標楷體;color:black;mso-color-alt:windowtext'><span style='mso-element:field-begin'></span>
REF _Ref111790651 \h <span style='mso-element:field-separator'></span></span><![endif]--><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-color-alt: windowtext; mso-hansi-font-family: "Times New Roman";">圖</span><span style="color: black; font-family: "Times New Roman",serif; mso-color-alt: windowtext; mso-fareast-font-family: 標楷體;"> <span lang="EN-US" style="mso-no-proof: yes;">8</span><span lang="EN-US"><!--[if gte mso 9]><xml>
<w:data>08D0C9EA79F9BACE118C8200AA004BA90B02000000080000000E0000005F005200650066003100310031003700390030003600350031000000</w:data>
</xml><![endif]--></span></span><!--[if supportFields]><span lang=EN-US
style='font-family:"Times New Roman",serif;mso-fareast-font-family:標楷體;
color:black;mso-color-alt:windowtext'><span style='mso-element:field-end'></span></span><![endif]--><span lang="EN-US" style="color: black; mso-color-alt: windowtext;"><span style="mso-field-code: " HYPERLINK ";"></span></span><span class="MsoHyperlink"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體; text-decoration: none; text-underline: none;"> </span></span><span class="MsoHyperlink"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman"; text-decoration: none; text-underline: none;">,</span></span><span class="MsoHyperlink"><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman"; mso-themecolor: text1; text-decoration: none; text-underline: none;">而</span></span><span class="MsoHyperlink"><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體; mso-themecolor: text1; text-decoration: none; text-underline: none;"> MakceCode </span></span><span class="MsoHyperlink"><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman"; mso-themecolor: text1; text-decoration: none; text-underline: none;">的完整程式碼可從</span></span><span class="MsoHyperlink"><span style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體; mso-themecolor: text1; text-decoration: none; text-underline: none;"> </span></span><span lang="EN-US" style="color: black; mso-color-alt: windowtext;"><span style="font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"><a href="https://reurl.cc/KQMDMy" target="_blank">https://reurl.cc/KQMDMy</a></span></span><span class="MsoHyperlink"><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-color-alt: windowtext; mso-fareast-font-family: 標楷體; text-decoration: none; text-underline: none;"> </span></span><span class="MsoHyperlink"><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-color-alt: windowtext; mso-hansi-font-family: "Times New Roman"; text-decoration: none; text-underline: none;">下載。</span></span><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"><o:p></o:p></span></p>
<p class="MsoNormal" style="background: white; mso-char-indent-count: 2.0; text-align: justify; text-indent: 24pt; text-justify: inter-ideograph;"><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"><o:p> </o:p></span></p>
<p align="center" class="MsoNormal" style="background: white; break-after: avoid; page-break-after: avoid; text-align: center;"><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"><span style="mso-spacerun: yes;"></span></span></p><div class="separator" style="clear: both; text-align: center;"><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"><span style="mso-spacerun: yes;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2bVFa3mVCoQIPkBAT09uttwt70PddJqcCNhSrjmxgMkg8dxVMPjX_rIYa1BrZrBYZSbfbXqoOQnH_zcwpitBXyGR5RjYiC9q-ktJzO_VXwQ8chyEhekh6V3Nb-tXLHGSIjckEU7xW9GEJaawl7kONFhNEJFmm7qPyWia6hOSyBZGWMJgqhHNSHQ/s478/B.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="459" data-original-width="478" height="384" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2bVFa3mVCoQIPkBAT09uttwt70PddJqcCNhSrjmxgMkg8dxVMPjX_rIYa1BrZrBYZSbfbXqoOQnH_zcwpitBXyGR5RjYiC9q-ktJzO_VXwQ8chyEhekh6V3Nb-tXLHGSIjckEU7xW9GEJaawl7kONFhNEJFmm7qPyWia6hOSyBZGWMJgqhHNSHQ/w400-h384/B.jpg" width="400" /></a> <div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9RnfVjSZHI9JIVZiy3qcBRTZHCLTWNb4vNxM5FR-dWUr-URiMAor5msEAPhG1pFIArTscKlR4jO4tx5_s2pvIyiJXfgWYIL1hpRox7qB_aKLNkXwBqxEzVxDcEfVZpHZaxqhT4xernSK_VV7QEIZDfo5O8qzaqSMk7dQu7QVs5zvhgLxYmxk66Q/s525/8.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="525" data-original-width="241" height="640" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9RnfVjSZHI9JIVZiy3qcBRTZHCLTWNb4vNxM5FR-dWUr-URiMAor5msEAPhG1pFIArTscKlR4jO4tx5_s2pvIyiJXfgWYIL1hpRox7qB_aKLNkXwBqxEzVxDcEfVZpHZaxqhT4xernSK_VV7QEIZDfo5O8qzaqSMk7dQu7QVs5zvhgLxYmxk66Q/w294-h640/8.jpg" width="294" /></a></div></span></span></div><p></p><div style="text-align: center;"><span style="font-size: x-small;"><a name="_Ref111790651"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">圖</span></a><span style="mso-bookmark: _Ref111790651;"><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> </span></span><!--[if supportFields]><span
style='mso-bookmark:_Ref111790651'></span><span style='mso-element:field-begin'></span><span
style='mso-bookmark:_Ref111790651'><span lang=EN-US style='font-family:"Times New Roman",serif;
mso-fareast-font-family:標楷體'><span style='mso-spacerun:yes'> </span>SEQ </span></span><span
style='mso-bookmark:_Ref111790651'><span style='font-family:標楷體;mso-ascii-font-family:
"Times New Roman";mso-hansi-font-family:"Times New Roman";mso-bidi-font-family:
"Times New Roman"'>圖</span></span><span style='mso-bookmark:_Ref111790651'><span
lang=EN-US style='font-family:"Times New Roman",serif;mso-fareast-font-family:
標楷體'> \* ARABIC <span style='mso-element:field-separator'></span></span></span><![endif]--><span style="mso-bookmark: _Ref111790651;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><span style="mso-no-proof: yes;">8</span></span></span><!--[if supportFields]><span
style='mso-bookmark:_Ref111790651'></span><span style='mso-element:field-end'></span><![endif]--><span style="mso-bookmark: _Ref111790651;"></span><span style="mso-bookmark: _Ref111790651;"></span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">:流程圖與</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> MakeCode </span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">程式對照</span></span><span style="text-align: left;"> </span></div>
<h1><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">進階學習</span><span lang="EN-US"><o:p></o:p></span></h1>
<p class="MsoListParagraph" style="background: white; margin-left: 24pt; mso-list: l0 level1 lfo1; mso-para-margin-left: 0gd; text-align: justify; text-indent: -24pt; text-justify: inter-ideograph;"><!--[if !supportLists]--><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: "Times New Roman";"><span style="mso-list: Ignore;">1.<span style="font: 7pt "Times New Roman";">
</span></span></span><!--[endif]--><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">讓迴圈在「奇數次」時(即</span><span style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"> <span lang="EN-US">a = 1, 3, 5</span></span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">)加上短音效,例如:</span><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;">ba
ding</span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">,</span><!--[if supportFields]><span lang=EN-US
style='mso-bidi-font-size:12.0pt;font-family:"Times New Roman",serif;
mso-fareast-font-family:標楷體;color:black'><span style='mso-element:field-begin'></span>
REF _Ref109908037 \h <span style='mso-element:field-separator'></span></span><![endif]--><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-color-alt: windowtext; mso-hansi-font-family: "Times New Roman";">圖</span><span style="color: black; font-family: "Times New Roman",serif; mso-color-alt: windowtext; mso-fareast-font-family: 標楷體;"> <span lang="EN-US" style="mso-no-proof: yes;">9</span></span><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"><!--[if gte mso 9]><xml>
<w:data>08D0C9EA79F9BACE118C8200AA004BA90B02000000080000000E0000005F005200650066003100300039003900300038003000330037000000</w:data>
</xml><![endif]--></span><!--[if supportFields]><span lang=EN-US
style='mso-bidi-font-size:12.0pt;font-family:"Times New Roman",serif;
mso-fareast-font-family:標楷體;color:black'><span style='mso-element:field-end'></span></span><![endif]--><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">。</span><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"><o:p></o:p></span></p>
<p class="MsoNormal" style="background: white; text-align: justify; text-justify: inter-ideograph;"><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"><o:p> </o:p></span></p>
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFFf3L0hJiIchtmgui4fb2LL9h329Dy42-2VFrOUA4aB0TDPI2NimpFv_6vHpdeZG4f8IVHGgyZcMRA1cPjzcMRnUOYllSqRANZDsw5Vtz26vHediiRfCIMTBxtznshnw3mRRmzoj5DTUHTVtl74KjYcoaBHV94lbOCZQ_t1t7IeJpdJUOB3Bxqg/s455/9.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="455" data-original-width="348" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFFf3L0hJiIchtmgui4fb2LL9h329Dy42-2VFrOUA4aB0TDPI2NimpFv_6vHpdeZG4f8IVHGgyZcMRA1cPjzcMRnUOYllSqRANZDsw5Vtz26vHediiRfCIMTBxtznshnw3mRRmzoj5DTUHTVtl74KjYcoaBHV94lbOCZQ_t1t7IeJpdJUOB3Bxqg/w306-h400/9.jpg" width="306" /></a></div>
<div style="text-align: center;"><span style="font-size: x-small;"><a name="_Ref109908037"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">圖</span></a><span style="mso-bookmark: _Ref109908037;"><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> </span></span><!--[if supportFields]><span
style='mso-bookmark:_Ref109908037'></span><span style='mso-element:field-begin'></span><span
style='mso-bookmark:_Ref109908037'><span lang=EN-US style='font-family:"Times New Roman",serif;
mso-fareast-font-family:標楷體'><span style='mso-spacerun:yes'> </span>SEQ </span></span><span
style='mso-bookmark:_Ref109908037'><span style='font-family:標楷體;mso-ascii-font-family:
"Times New Roman";mso-hansi-font-family:"Times New Roman";mso-bidi-font-family:
"Times New Roman"'>圖</span></span><span style='mso-bookmark:_Ref109908037'><span
lang=EN-US style='font-family:"Times New Roman",serif;mso-fareast-font-family:
標楷體'> \* ARABIC <span style='mso-element:field-separator'></span></span></span><![endif]--><span style="mso-bookmark: _Ref109908037;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><span style="mso-no-proof: yes;">9</span></span></span><!--[if supportFields]><span
style='mso-bookmark:_Ref109908037'></span><span style='mso-element:field-end'></span><![endif]--><span style="mso-bookmark: _Ref109908037;"></span><span style="mso-bookmark: _Ref109908037;"></span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">:</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">ba ding </span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">短音效</span></span></div>
<p class="MsoNormal"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><o:p> </o:p></span></p>
<p class="MsoListParagraph" style="background: white; margin-left: 23.75pt; mso-list: l0 level1 lfo1; mso-pagination: lines-together; mso-para-margin-left: 0gd; text-align: justify; text-indent: -23.75pt; text-justify: inter-ideograph;"><!--[if !supportLists]--><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: "Times New Roman";"><span style="mso-list: Ignore;">2.<span style="font: 7pt "Times New Roman";">
</span></span></span><!--[endif]--><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">修改</span><!--[if supportFields]><span
lang=EN-US style='mso-bidi-font-size:12.0pt;font-family:"Times New Roman",serif;
mso-fareast-font-family:標楷體;color:black'><span style='mso-element:field-begin'></span>
REF _Ref111790651 \h <span style='mso-element:field-separator'></span></span><![endif]--><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-color-alt: windowtext; mso-hansi-font-family: "Times New Roman";">圖</span><span style="color: black; font-family: "Times New Roman",serif; mso-color-alt: windowtext; mso-fareast-font-family: 標楷體;"> <span lang="EN-US" style="mso-no-proof: yes;">8</span></span><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"><!--[if gte mso 9]><xml>
<w:data>08D0C9EA79F9BACE118C8200AA004BA90B02000000080000000E0000005F005200650066003100310031003700390030003600350031000000</w:data>
</xml><![endif]--></span><!--[if supportFields]><span lang=EN-US
style='mso-bidi-font-size:12.0pt;font-family:"Times New Roman",serif;
mso-fareast-font-family:標楷體;color:black'><span style='mso-element:field-end'></span></span><![endif]--><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"> </span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">程式,使得程式在第</span><span style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"> <span lang="EN-US">i </span></span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">次迴圈時,閃爍</span><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"> i
</span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">次</span><span style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"> <span lang="EN-US">Hi</span></span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">,例如:</span><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;">i = 3</span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">,則閃爍三次</span><span style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"> <span lang="EN-US">Hi</span></span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">。</span><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"><o:p></o:p></span></p>
<p class="MsoListParagraph" style="background: white; margin-left: 24pt; mso-list: l0 level1 lfo1; mso-para-margin-left: 0gd; text-align: justify; text-indent: -24pt; text-justify: inter-ideograph;"><!--[if !supportLists]--><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: "Times New Roman";"><span style="mso-list: Ignore;">3.<span style="font: 7pt "Times New Roman";">
</span></span></span><!--[endif]--><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">承</span><span style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"> <span lang="EN-US">2</span></span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">,根據修改完成後的程式再以</span><span style="color: black; font-family: "Times New Roman",serif; mso-bidi-font-size: 12.0pt; mso-fareast-font-family: 標楷體;"> <span lang="EN-US">fChart </span></span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-size: 12.0pt; mso-hansi-font-family: "Times New Roman";">酌修</span><!--[if supportFields]><span
lang=EN-US style='font-family:"Times New Roman",serif;mso-fareast-font-family:
標楷體;color:black;mso-color-alt:windowtext'><span style='mso-element:field-begin'></span>
REF _Ref111620918 \h <span style='mso-element:field-separator'></span></span><![endif]--><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-color-alt: windowtext; mso-hansi-font-family: "Times New Roman";">圖</span><span style="color: black; font-family: "Times New Roman",serif; mso-color-alt: windowtext; mso-fareast-font-family: 標楷體;"> <span lang="EN-US" style="mso-no-proof: yes;">2</span><span lang="EN-US"><!--[if gte mso 9]><xml>
<w:data>08D0C9EA79F9BACE118C8200AA004BA90B02000000080000000E0000005F005200650066003100310031003600320030003900310038000000</w:data>
</xml><![endif]--></span></span><!--[if supportFields]><span lang=EN-US
style='font-family:"Times New Roman",serif;mso-fareast-font-family:標楷體;
color:black;mso-color-alt:windowtext'><span style='mso-element:field-end'></span></span><![endif]--><span lang="EN-US" style="color: black; font-family: "Times New Roman",serif; mso-color-alt: windowtext; mso-fareast-font-family: 標楷體;"> </span><span face="標楷體" style="color: black; mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-color-alt: windowtext; mso-hansi-font-family: "Times New Roman";">的流程圖。</span></p><div style="mso-element: footnote-list;">
<hr align="left" size="1" width="33%" />
<!--[endif]-->
<div id="ftn1" style="mso-element: footnote;">
<div style="text-align: justify;"><span style="font-size: x-small;">[0] <a href="http://creativecommons.tw/explore" style="color: #2288bb; font-family: times, "times new roman", serif; text-decoration-line: none;" target="_blank">六種授權條款</a><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;">。<br /></span><span class="MsoFootnoteReference"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><span style="mso-special-character: footnote;"><span class="MsoFootnoteReference"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-ansi-language: EN-US; mso-bidi-language: AR-SA; mso-fareast-font-family: 標楷體; mso-fareast-language: ZH-TW;">[1]</span></span><!--[endif]--></span></span></span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> </span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">迴圈是初學程式設計最困難的部分。透過流程圖,初學者可以清楚了解其運行「過程」。如果初學者無法自行追蹤迴圈的執行過程和了解迴圈控制變數的變化,就沒有真正的學會迴圈結構</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">──</span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">陳會安老師如是說(</span><span lang="EN-US"><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體; outline-width: 0px !important; user-select: auto !important;"><a href="https://reurl.cc/8p5aQb" target="_blank">https://reurl.cc/8p5aQb</a></span></span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">)。<br /></span><span class="MsoFootnoteReference"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><span style="mso-special-character: footnote;"><span class="MsoFootnoteReference"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-ansi-language: EN-US; mso-bidi-language: AR-SA; mso-fareast-font-family: 標楷體; mso-fareast-language: ZH-TW;">[2]</span></span><!--[endif]--></span></span></span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> </span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">改編自陳會安老師原版的</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> <a name="_Hlk111644945">fChart 150 </a></span><span style="mso-bookmark: _Hlk111644945;"><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">的</span></span><span style="mso-bookmark: _Hlk111644945;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> GitHub</span></span><span style="mso-bookmark: _Hlk111644945;"></span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">(</span><span lang="EN-US"><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><a href="https://reurl.cc/9p18Oj" target="_blank">https://reurl.cc/9p18Oj</a></span></span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">)。<br /></span><span class="MsoFootnoteReference"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><span style="mso-special-character: footnote;"><span class="MsoFootnoteReference"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-ansi-language: EN-US; mso-bidi-language: AR-SA; mso-fareast-font-family: 標楷體; mso-fareast-language: ZH-TW;">[3]</span></span><!--[endif]--></span></span></span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> </span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">如果發生檔案有在下載但無法全部下載完時,請先暫時關閉防毒軟體。<br /></span><span class="MsoFootnoteReference"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><span style="mso-special-character: footnote;"><span class="MsoFootnoteReference"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-ansi-language: EN-US; mso-bidi-language: AR-SA; mso-fareast-font-family: 標楷體; mso-fareast-language: ZH-TW;">[4]</span></span><!--[endif]--></span></span></span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> </span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">讀者也可自行變更檔案的<b>關聯(</b></span><b><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">association</span></b><b><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">)</span></b><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">程式,在</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> .fpp </span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">的</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> fChart
</span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">流程圖檔上雙撃時可以直接以</span><span style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> <span lang="EN-US">fChart </span></span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">直譯器開啟之。<br /></span><span class="MsoFootnoteReference"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><span style="mso-special-character: footnote;"><span class="MsoFootnoteReference"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-ansi-language: EN-US; mso-bidi-language: AR-SA; mso-fareast-font-family: 標楷體; mso-fareast-language: ZH-TW;">[5]</span></span><!--[endif]--></span></span></span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"> </span><span face="標楷體" style="mso-ascii-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-hansi-font-family: "Times New Roman";">從此處就可以很容易看出流程圖和任何程式語言是可以一一對應轉換的。然而,根據陳會安老師的進一步研究,目前尚無這樣可供「自動」轉換的演算法存在。但是,人工手動轉換是可行的!</span></span></div>
</div>
</div>Ted Leehttp://www.blogger.com/profile/03077454870590095355noreply@blogger.com0tag:blogger.com,1999:blog-1468347421357730785.post-39008767406274003862022-08-13T07:13:00.046+08:002022-08-15T14:25:04.235+08:00[fChart, Python] 以 fChart 馭 Python:巢狀迴圈(7/11)<h2 style="text-align: center;"> <span style="text-align: center;">以 fChart 馭 Python:</span></h2><h3 style="text-align: center;">巢狀迴圈(7/11)</h3><div style="background-color: white; text-align: center;"><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><a href="https://www.facebook.com/groups/134149180510967/" style="color: #2288bb; text-decoration-line: none;" target="_blank"><span style="font-family: times, "times new roman", serif;">Ted Lee的土饅頭(To Mentor)工坊</span></a></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><div><span style="font-family: times, "times new roman", serif;">Line:ted2016.kpvs</span><br /><span style="font-family: times, "times new roman", serif;">Email:Lct4246@gmail.com</span><br /><span style="font-family: times, "times new roman", serif;"><span style="font-family: "times new roman", serif;">FB</span>:<span style="font-family: "times new roman", serif;">http://gg.gg/</span><span style="color: #00cc00; font-family: "times new roman", serif;">TedLee</span><span style="color: red; font-family: "times new roman", serif;">FB</span><span style="font-family: "times new roman", serif;">/</span></span></div><div><span lang="" style="font-family: times, "times new roman", serif; font-size: 12pt;">Blog<span style="font-family: "times new roman"; font-size: small;">:</span>http://gg.gg/<span style="color: #00cc00;">TedLee</span><span style="color: red;">Blog</span>/</span><br /></div></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><span style="font-family: times, "times new roman", serif;"><br /></span></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><span style="font-family: times, "times new roman", serif;">Aug. 13, 2022</span></div><div><span><span style="color: #222222; font-family: times, "times new roman", serif;"><span style="font-size: 13.2px;"><div class="separator" style="clear: both;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s88/CC.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="31" data-original-width="88" height="31" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s1600/CC.png" width="88" /></a>[1]</div></span></span><div class="separator" style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: left;"><br /></div><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify;"><span style="color: #222222;">接續著本 fChart 系列前文《<a href="https://lct4246.blogspot.com/2021/12/fchart-python-fchart.html" target="_blank">以 fChart 馭 Python:練 fChart 了沒?(1/11)</a>》(<a href="https://reurl.cc/oeDGN3">https://reurl.cc/oeDGN3</a>),我們將針對</span>圖1 的「10 大項目之 6」<span style="color: #222222;">的 5 個實例</span><span style="color: #222222; text-align: center; white-space: pre-wrap;">(可從<a href="https://reurl.cc/RXXDqr" target="_blank">https://reurl.cc/RXXDqr</a> </span><span style="color: #222222; text-align: center; white-space: pre-wrap;">下載)</span><span style="color: #222222;">,從</span></div><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;"><span></span><blockquote style="text-align: center;"><span></span><span></span><span></span><span></span><span></span><span></span><blockquote><span></span></blockquote></blockquote><blockquote><blockquote style="text-align: center;"><blockquote><span>原始問題描述</span><span>到</span><span>以流程圖表達解法</span><span>,</span></blockquote></blockquote><blockquote style="text-align: center;"><blockquote><span>再對照流程圖寫出 Python 語法程式</span></blockquote></blockquote></blockquote><blockquote style="text-align: center;"><blockquote><span></span></blockquote><span></span><blockquote><span></span></blockquote><span></span></blockquote><blockquote style="text-align: center;"><span></span></blockquote><blockquote style="text-align: center;"><span></span></blockquote><blockquote style="text-align: justify;"><span></span></blockquote><span></span></div><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify;"><span style="color: #222222;">的過程詳細說明整個</span><span style="color: #222222;">的</span><b><span style="color: #222222;">問題解決</span><span style="color: #222222; white-space: pre-wrap;">(problem solving)</span></b><span style="color: #222222;">過程。</span></div><div class="separator" style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;"><div class="separator" style="clear: both; text-align: center; white-space: pre-wrap;"><div class="separator"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; font-size: 13.2px;"><div class="separator" style="clear: both;"><br /></div></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; font-size: 13.2px;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEhQLoR_CflXynYJOI0sXUoi7GCwSMJO7mrjD_rqQlar8WQRNL13vpZCNm4c28UnMLep7wVhl8i-5Kuu9p7lTONAlgD4MC8q6PWRctWS5grSDklB4YQqTVxqEGkBCx6xdM5DDbhPaqIVTASpiSmSjhZUfakBfziawEcqm96_1mJOT_w1AUa5-abaCw" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="133" data-original-width="444" height="96" src="https://blogger.googleusercontent.com/img/a/AVvXsEhQLoR_CflXynYJOI0sXUoi7GCwSMJO7mrjD_rqQlar8WQRNL13vpZCNm4c28UnMLep7wVhl8i-5Kuu9p7lTONAlgD4MC8q6PWRctWS5grSDklB4YQqTVxqEGkBCx6xdM5DDbhPaqIVTASpiSmSjhZUfakBfziawEcqm96_1mJOT_w1AUa5-abaCw" width="320" /></a></div></div><div class="separator" style="clear: both;"><span style="font-size: x-small;">圖 1:10 大項目之 6</span></div></div></div></div></div></div></div></div></div><div class="separator" style="clear: both; text-align: center; white-space: pre-wrap;"><span><a name='more'></a></span></div></div><h2 style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;">原始問題</h2><div class="separator" style="clear: both; text-align: left;"><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify; white-space: pre-wrap;"><div class="separator" style="clear: both; white-space: normal;"><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="color: #222222;">我們試圖把會安老師編排的範例一一還原到初始的問題形式來帶領讀者們思考:</span></div><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="color: #222222;"><br /></span></div><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="color: #2b00fe;"></span><blockquote><span style="color: #2b00fe;">問題</span><span style="color: #222222;"> --- </span><span style="color: red;">流程圖</span><span style="color: #222222;"> ---> </span><span style="color: #2b00fe;">解法</span></blockquote><span style="color: #2b00fe;"></span></div><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="color: #222222;"><br /></span></div><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="color: #222222;">一連串的</span><span style="color: #222222;">問題解決</span><span style="color: #222222;">奇幻之旅。筆者再次強調,</span></div><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="color: #222222;"><br /></span></div><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="color: #222222;"><blockquote>「解決問題」是編程訓練的終極目的,而「流程圖」乃為邏輯表達之母(積木拼圖湊答案不是)。</blockquote></span></div></div></div><span style="color: #222222;"><h4></h4></span><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; text-align: justify;">1. <b>01.使用巢狀迴圈顯示值</b>:發講義給三桌,每桌有五個人</span><span style="text-align: justify;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjPRWtwbNrNm7s9oLM9Q-GloYx0ec2N5rSiSg7-S00Ok0nzN3VMJaXz5o2w5r4vAhXK_z-Yt-GqO-9OR2kKo5WQ9IkZAauHZlln23roL4tslW2SmE7Jii0IYlVH4gnMclJKaE22UMdkWz_CSz-Q34-UX7jjwfr-p-4gxHWjfMxN6AGw3QbAEfJjqw" style="margin-left: 1em; margin-right: 1em; text-align: center;"><img alt="" data-original-height="317" data-original-width="157" height="240" src="https://blogger.googleusercontent.com/img/a/AVvXsEjPRWtwbNrNm7s9oLM9Q-GloYx0ec2N5rSiSg7-S00Ok0nzN3VMJaXz5o2w5r4vAhXK_z-Yt-GqO-9OR2kKo5WQ9IkZAauHZlln23roL4tslW2SmE7Jii0IYlVH4gnMclJKaE22UMdkWz_CSz-Q34-UX7jjwfr-p-4gxHWjfMxN6AGw3QbAEfJjqw" width="119" /></a></span><span style="text-align: justify;">──也可以想像成分針每走 60 格(60 分)後時針才走 1 格(1 小時)。</span></div><div class="separator" style="clear: both; text-align: left;"><span style="text-align: justify;">2. <b>02.九九乘法表</b>:印出一整張完整的九九乘法表</span><span style="text-align: justify;">。註:</span><span style="text-align: justify;">十十乘法表</span><span style="text-align: justify;">的概念在 108 新課綱是排在國小數學低年級階段教授(</span><a href="https://reurl.cc/2D8q2X" style="text-align: justify;">https://reurl.cc/2D8q2X</a><span style="text-align: justify;">) <a href="https://blogger.googleusercontent.com/img/a/AVvXsEhTLrIxvoIuoTSejTC9C1JBbZTa6zqA9OeAowAu0-L1n9a1iHpQXJyY30AH2xYR1r7yeaBgFid5CIjYUGcXidCVHVQCpEwG1xqt1WK1cfk8SXm9FKjZ6LlUhWgkOx1-7POnaDj50D2lrVs7-KvPzTGBO7Y5OjJsMMRXoWlWkctgVOLGca2fys_niA" style="margin-left: 1em; margin-right: 1em; text-align: center;"><img alt="" data-original-height="225" data-original-width="631" height="229" src="https://blogger.googleusercontent.com/img/a/AVvXsEhTLrIxvoIuoTSejTC9C1JBbZTa6zqA9OeAowAu0-L1n9a1iHpQXJyY30AH2xYR1r7yeaBgFid5CIjYUGcXidCVHVQCpEwG1xqt1WK1cfk8SXm9FKjZ6LlUhWgkOx1-7POnaDj50D2lrVs7-KvPzTGBO7Y5OjJsMMRXoWlWkctgVOLGca2fys_niA=w640-h229" width="640" /></a>。</span></div><div class="separator" style="clear: both; text-align: left;"><span style="text-align: justify;">3. <b>03.數字三角形</b>:輸出一個以有序<b>數列(sequence)</b>填滿的<b>直角三角形</b></span><b style="text-align: justify;">(right triangle)</b><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2WS1XETH0nlo6H2R0nTLRmkpjL4OiUxe5akgecTVnxS9cPe5nil3GpgskgfYv2h352JotZoHl3mmqEvzokHWvqfX-fK_htdC68JlkdJT_vA3GnenoCo2f-pDA8tluUiTs6k-qVzKWL10kcLRzZ1GPmhvIlq_4NvyP7EZNRXtFICiNrG6Hp-fRkw/s227/Snap4.jpg" style="margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" data-original-height="227" data-original-width="152" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2WS1XETH0nlo6H2R0nTLRmkpjL4OiUxe5akgecTVnxS9cPe5nil3GpgskgfYv2h352JotZoHl3mmqEvzokHWvqfX-fK_htdC68JlkdJT_vA3GnenoCo2f-pDA8tluUiTs6k-qVzKWL10kcLRzZ1GPmhvIlq_4NvyP7EZNRXtFICiNrG6Hp-fRkw/s1600/Snap4.jpg" width="152" /></a><span style="text-align: justify;">。</span><span style="text-align: justify;">註:數列</span><span style="text-align: justify;">和</span><span style="text-align: justify;">直角三角形</span><span style="text-align: justify;">的概念在 108 新課綱是排在國中數學階段教授(</span><a href="https://reurl.cc/2D8q2X" style="text-align: justify;">https://reurl.cc/2D8q2X</a><span style="text-align: justify;">) 。</span></div><div class="separator" style="clear: both; text-align: left;"><span style="text-align: justify;">4. <b>04.數字倒三角形</b>:</span><span style="text-align: justify;">輸出一個以有序數列填滿的倒直角三角形</span><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhlV4Q1A2J5hjkRkYxPsvH-NEMLQxB5-M0kxrbBNCljNMDXnaXhoOr1lonXJvMriQXq8BWfyf-TQpeRs5gBWy87RavrfCeRh_OEPOFQKaH0iynnjtfErqvnkPO-7_gvZOUiHv8Ct4zkEMli0qJl7n2NoCP_XTlBNXhGkUFRrS5PU2aq_1hBypM61Q/s225/Snap6.jpg" style="font-weight: bold; margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" data-original-height="225" data-original-width="152" height="225" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhlV4Q1A2J5hjkRkYxPsvH-NEMLQxB5-M0kxrbBNCljNMDXnaXhoOr1lonXJvMriQXq8BWfyf-TQpeRs5gBWy87RavrfCeRh_OEPOFQKaH0iynnjtfErqvnkPO-7_gvZOUiHv8Ct4zkEMli0qJl7n2NoCP_XTlBNXhGkUFRrS5PU2aq_1hBypM61Q/s1600/Snap6.jpg" width="152" /></a><span style="text-align: justify;">。</span><span style="text-align: justify;">註:數列和直角三角形</span><span style="text-align: justify;">的概念在 108 新課綱是排在國中數學階段教授(</span><a href="https://reurl.cc/2D8q2X" style="text-align: justify;">https://reurl.cc/2D8q2X</a><span style="text-align: justify;">) 。</span></div><div class="separator" style="clear: both; text-align: left;"><span style="text-align: justify;"><span>5. <b>05.星號正三角形</b>:</span><b style="text-align: left;"><span style="font-weight: 400; text-align: justify;">輸出一個以 * 填滿的</span><span style="text-align: justify;">正三角形</span></b></span><span style="text-align: justify;"><b>(equilateral triangle)</b></span><span style="text-align: justify;"><b style="text-align: left;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhm1HsbMzc-Ge7UgTnTSa396pXAY4gb-e03zn-9v-oC8yhiALy2IdvXSZZXgW09VWB-IQO6nRGhEAGErnLsUjRmysGUuS7I1IJGLi-uoVwjRn3IQmUmL9xjpnYQo8ABLCZiw0Z9XvsnRIBMAhhQvWgv3pNIUMhoDtmC82ln10LG72hJdAUiJg8QYQ/s221/Snap8.jpg" style="margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" data-original-height="221" data-original-width="220" height="221" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhm1HsbMzc-Ge7UgTnTSa396pXAY4gb-e03zn-9v-oC8yhiALy2IdvXSZZXgW09VWB-IQO6nRGhEAGErnLsUjRmysGUuS7I1IJGLi-uoVwjRn3IQmUmL9xjpnYQo8ABLCZiw0Z9XvsnRIBMAhhQvWgv3pNIUMhoDtmC82ln10LG72hJdAUiJg8QYQ/s1600/Snap8.jpg" width="220" /></a></b><span>。</span><span>註:</span></span><span style="text-align: justify;">正三角形</span><span style="text-align: justify;">的概念在 108 新課綱是排在國中數學階段教授(</span><a href="https://reurl.cc/2D8q2X" style="text-align: justify;">https://reurl.cc/2D8q2X</a><span style="text-align: justify;">) 。</span></div><div class="separator" style="clear: both; text-align: left;"><div class="separator" style="clear: both;"><span style="text-align: justify;"><div class="separator" style="clear: both; text-align: left;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; text-align: justify;"><div class="separator" style="clear: both; font-weight: bold; text-align: left;"><span><!--more--></span></div><div class="separator" style="clear: both; font-weight: bold; text-align: left;"><h2 style="clear: both;"></h2></div></span></div><div class="separator" style="clear: both; text-align: left;"><h2 style="clear: both; text-align: justify;"><span style="color: #222222; text-align: left;">流程圖與 Python 語法對轉</span></h2></div></span></div></div><div class="separator" style="clear: both; text-align: left;"><div class="separator" style="clear: both;"><div style="text-align: justify;"><h3><div class="separator" style="clear: both;"><span style="font-size: small;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span><span style="font-weight: 400;">1. </span></span><b>01.</b><span>使用巢狀迴圈顯示值<span style="font-weight: 400;">:</span></span></span><span style="font-weight: normal;"><span>用迴圈控制變數 i 來控制</span></span><span style="color: #222222;">外層(outer)</span><span style="color: #222222; font-weight: 400;">迴圈從 1、2 一直跑到 3,而每個 i 值切換前,</span><span style="font-weight: normal;">用迴圈控制變數 j 來控制</span><span style="color: #222222;">內層(inner)</span><span style="color: #222222; font-weight: 400;"><div class="separator" style="clear: both; text-align: center;"><br /></div>迴圈從 1、2 一直跑到 5。這兩層完整圖示整理於圖 2。因此,兩層的迴圈共執行 i × j = 3 × 5 = 15 次。</span></span></div><div class="separator" style="clear: both;"><span style="color: #222222; font-size: medium; font-weight: 400;"><br /></span></div><div class="separator" style="clear: both;"><span style="color: #222222; font-size: medium; font-weight: 400;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEhaqc0InbYqYrPqjKJptfIRkGMiRBWUX9AxuyMTjRbc3TS4tj0mXBMP5qdxKaWVMjFKCSxxbWZLx-Dv3tmq8hS42mssEUhbOKHQ1DPePAHLqHvgfaTn4TfYiZTKAm64dyNg1VM-y8eA7Bl9AUvMSIvMkRx1LMLUGQ6xXqufa5GDregC6LbclXMYtg" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="183" data-original-width="1238" height="47" src="https://blogger.googleusercontent.com/img/a/AVvXsEhaqc0InbYqYrPqjKJptfIRkGMiRBWUX9AxuyMTjRbc3TS4tj0mXBMP5qdxKaWVMjFKCSxxbWZLx-Dv3tmq8hS42mssEUhbOKHQ1DPePAHLqHvgfaTn4TfYiZTKAm64dyNg1VM-y8eA7Bl9AUvMSIvMkRx1LMLUGQ6xXqufa5GDregC6LbclXMYtg" width="320" /></a></div></span><div style="text-align: center;"><span style="font-size: x-small; font-weight: 400;">圖 2:i 與 j 的變化情形</span></div></div><div class="separator" style="clear: both;"><span style="color: #222222; font-size: medium; font-weight: 400;"><br /></span></div><div class="separator" style="clear: both; font-weight: 400;"><span style="font-size: small;"><span style="color: #222222; text-align: right;"><span><span><span style="color: black;">將 </span></span></span></span><span style="color: black; text-align: left;">Python 程式</span><span style="color: black; text-align: left;">轉換妥後</span><span style="color: black;">以「</span><span style="color: black; text-align: center;"><span style="white-space: pre-wrap;">06-01.使用巢狀迴圈顯示值.py」存檔執行</span></span><span style="color: black;">後就能看到</span><span style="color: black; text-align: left;">如圖 3</span><span style="color: black; text-align: left;"> 所對應的</span><span style="color: black;">執行結果。</span></span></div><div class="separator" style="clear: both; font-size: medium; font-weight: 400;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><br /></span></div><div class="separator" style="clear: both; font-weight: 400; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; font-size: medium; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjomMa4006halT0mu2KrTs1AtsdpOIWpeh_yzWNpTHXXRXJ4lrMgcMc0Sx5UBNetI0llhh4lu4TBmiW6N_zNj80-MUiTQ_a-WbePKluvCXdnokVib3J4dy_IbZIirPfs--HKjnoWowFmv_Dn-3P7p4dB9pDp4uaF34Ymhyf0vn7STsXXiXG3-gLEA" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="801" data-original-width="1420" src="https://blogger.googleusercontent.com/img/a/AVvXsEjomMa4006halT0mu2KrTs1AtsdpOIWpeh_yzWNpTHXXRXJ4lrMgcMc0Sx5UBNetI0llhh4lu4TBmiW6N_zNj80-MUiTQ_a-WbePKluvCXdnokVib3J4dy_IbZIirPfs--HKjnoWowFmv_Dn-3P7p4dB9pDp4uaF34Ymhyf0vn7STsXXiXG3-gLEA=s16000" /></a></div><span style="color: black; font-size: x-small;">圖 3:兩層迴圈套疊</span></div></div></div></span></div><div class="separator" style="clear: both; font-size: medium; font-weight: 400;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"></span></div></h3><h3><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif"><span style="font-size: small;"><span style="color: #222222; font-weight: 400;">2. </span><span style="color: #222222;">02.九九乘法表</span><span style="font-weight: 400;"><span style="color: #222222;">:觀察下列九九乘法的輸出結果,紅字用 </span><span style="color: red;">i</span><span style="color: #222222;"> 來控制,它會從 1 跑到 9。在每個 i 時,讓 j 也</span></span></span></span><span style="font-weight: normal;"><span style="font-size: small;">從 1 跑到 9。概念上是每次固定一個 <span style="color: red;">i</span> 值,然後把 j 掃一遍即為所得。</span></span></div><div class="separator" style="clear: both;"><br /></div></h3><h3><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span style="font-weight: 400;"></span></span></span></div><div class="separator" style="clear: both; font-weight: 400; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><div class="separator" style="clear: both; text-align: justify;"><p class="MsoNormal" style="font-size: medium;"><span lang="EN-US" style="color: red; font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">1</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">*1=1 <span style="color: red;">1</span>*2=2 <span style="color: red;">1</span>*3=3 <span style="color: red;">1</span>*4=4 <span style="color: red;">1</span>*5=5 <span style="color: red;">1</span>*6=6 <span style="color: red;">1</span>*7=7 <span style="color: red;">1</span>*8=8 <span style="color: red;">1</span>*9=9<o:p></o:p></span></p>
<p class="MsoNormal" style="font-size: medium;"><span lang="EN-US" style="color: red; font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">2</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">*1=2 2*2=4
2*3=6 2*4=8 2*5=10 2*6=12 2*7=14 2*8=16 2*9=18<o:p></o:p></span></p>
<p class="MsoNormal" style="font-size: medium;"><span lang="EN-US" style="color: red; font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">3</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">*1=3
3*2=6 3*3=9 3*4=12 3*5=15 3*6=18 3*7=21 3*8=24 3*9=27<o:p></o:p></span></p>
<p class="MsoNormal" style="font-size: medium;"><span lang="EN-US" style="color: red; font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">4</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">*1=4
4*2=8 4*3=12 4*4=16 4*5=20 4*6=24 4*7=28 4*8=32 4*9=36<o:p></o:p></span></p>
<p class="MsoNormal" style="font-size: medium;"><span lang="EN-US" style="color: red; font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">5</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">*1=5
5*2=10 5*3=15 5*4=20 5*5=25 5*6=30 5*7=35 5*8=40 5*9=45<o:p></o:p></span></p>
<p class="MsoNormal" style="font-size: medium;"><span lang="EN-US" style="color: red; font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">6</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">*1=6
6*2=12 6*3=18 6*4=24 6*5=30 6*6=36 6*7=42 6*8=48 6*9=54<o:p></o:p></span></p>
<p class="MsoNormal" style="font-size: medium;"><span lang="EN-US" style="color: red; font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">7</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">*1=7
7*2=14 7*3=21 7*4=28 7*5=35 7*6=42 7*7=49 7*8=56 7*9=63<o:p></o:p></span></p>
<p class="MsoNormal" style="font-size: medium;"><span lang="EN-US" style="color: red; font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">8</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">*1=8
8*2=16 8*3=24 8*4=32 8*5=40 8*6=48 8*7=56 8*8=64 8*9=72<o:p></o:p></span></p>
<p class="MsoNormal" style="font-size: medium;"><span lang="EN-US" style="color: red; font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">9</span><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;">*1=9
9*2=18 9*3=27 9*4=36 9*5=45 9*6=54 9*7=63 9*8=72 9*9=81<o:p></o:p></span></p><p class="MsoNormal" style="font-size: medium;"><br /></p><div><span style="font-size: small;"><span lang="EN-US" style="font-family: "Times New Roman",serif; mso-fareast-font-family: 標楷體;"><span style="color: #222222; font-family: "Times New Roman"; text-align: right;"><span><span><span style="color: black;">將 </span></span></span></span><span style="color: black; font-family: "Times New Roman"; text-align: left;">Python 程式</span><span style="color: black; font-family: "Times New Roman"; text-align: left;">轉換妥後</span><span style="color: black; font-family: "Times New Roman";">以「</span><span style="color: black; font-family: "Times New Roman"; text-align: center;"><span style="white-space: pre-wrap;">06-02.九九乘法表.py」存檔執行</span></span><span style="color: black; font-family: "Times New Roman";">後就能看到</span><span style="color: black; font-family: "Times New Roman"; text-align: left;">如圖 4</span><span style="color: black; font-family: "Times New Roman"; text-align: left;"> 所對應的</span><span style="color: black; font-family: "Times New Roman";">執行結果。</span></span></span></div></div><div class="separator" style="clear: both; font-size: medium;"><br /></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both; font-size: medium; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjZ7flOTQmf9OlNrezDfmW7bzZF-dvPD1gO3TcOYr1KjpXrm7YH3QYSKfLsn4C06xFBY4w2Usc_xu8vXZpeK-NuYm-i6JYj1SZMMxCI7FungjdE1kM3EsZaXnX5HywGXhgdjLClUo9Jw87KMGGND1YGXKKNClEQmnKfvjzm0b2e4q3s3BF3eHToBQ" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="720" data-original-width="1611" src="https://blogger.googleusercontent.com/img/a/AVvXsEjZ7flOTQmf9OlNrezDfmW7bzZF-dvPD1gO3TcOYr1KjpXrm7YH3QYSKfLsn4C06xFBY4w2Usc_xu8vXZpeK-NuYm-i6JYj1SZMMxCI7FungjdE1kM3EsZaXnX5HywGXhgdjLClUo9Jw87KMGGND1YGXKKNClEQmnKfvjzm0b2e4q3s3BF3eHToBQ=s16000" /></a></div></div><div class="separator" style="clear: both; text-align: center;"><span style="color: black; font-size: x-small;">圖 4:印出九九乘法表</span></div></div></span></div><div class="separator" style="clear: both; font-size: medium; font-weight: 400; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="color: black; font-size: small;"><br /></span></span></div></h3><h3><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span style="font-weight: 400;">3.<span> </span></span>03.數字三角形<span style="font-weight: 400;">:i 由上到下,每次固定一個值時,讓 j 由左到右掃一次<a href="https://blogger.googleusercontent.com/img/a/AVvXsEjlcJJkB4rRU1GuyvCI9YGs5WwYv5YEfHCbpNnKCRZzCMVxkyiNbBaovnDk7tsbVVgbD_ShX14uuswrQtKV5TmDOlC7HAJ54xg2pjaHIAuDomHcv8xGRTz9r1yShHW8Ifu9SN8vpNM25LkuwD1rza0EgCYbBvlmaEYSzMDf9aa43WlbBDeL88Xlcg" style="margin-left: 1em; margin-right: 1em; text-align: center;"><img alt="" data-original-height="227" data-original-width="152" height="240" src="https://blogger.googleusercontent.com/img/a/AVvXsEjlcJJkB4rRU1GuyvCI9YGs5WwYv5YEfHCbpNnKCRZzCMVxkyiNbBaovnDk7tsbVVgbD_ShX14uuswrQtKV5TmDOlC7HAJ54xg2pjaHIAuDomHcv8xGRTz9r1yShHW8Ifu9SN8vpNM25LkuwD1rza0EgCYbBvlmaEYSzMDf9aa43WlbBDeL88Xlcg" width="161" /></a>。</span></span></span></div><div class="separator" style="clear: both; text-align: justify;"><span style="font-size: small;"><span style="color: #222222; font-weight: 400; text-align: right;"><span><span><span style="color: black;">將 </span></span></span></span><span style="color: black; font-weight: 400; text-align: left;">Python 程式</span><span style="color: black; font-weight: 400; text-align: left;">轉換妥後</span><span style="color: black; font-weight: 400;">以「</span><span style="color: black; text-align: center;"><span><span style="font-weight: 400; white-space: pre-wrap;">06-03.數字三角形.py」存檔執行</span></span></span><span style="color: black; font-weight: 400;">後就能看到</span><span style="color: black; font-weight: 400; text-align: left;">如圖 5</span><span style="color: black; font-weight: 400; text-align: left;"> 所對應的</span><span style="color: black; font-weight: 400;">執行結果。</span></span></div></h3><h3><div class="separator" style="clear: both; font-size: medium; font-weight: 400;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="color: black; font-size: small;"><div></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="text-align: justify;"><span></span></div></div></div></span></span></div></h3><h3><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span style="font-weight: 400;"></span></span></span></div><div class="separator" style="clear: both; font-weight: 400; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><div class="separator" style="clear: both; font-size: medium;"><br /></div><div class="separator" style="clear: both; font-size: medium; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMj88XKNUsCnqVyL_nXDUbwQAcevei1JF_CHvDthBEhKTP8Wo2U5wnj1NlwFzFVBjblpSNfLuFQvIEj3Qt7v4dk_gVRmm4cIaWiLSofI1axsdz1LaLIswdY-csanCsIct1fIbM2jKpt0UORo0M_m_HvC-F3R1MLZ5JHYGzklV8DA1akzIR4VaeKg/s1572/Snap5.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="677" data-original-width="1572" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMj88XKNUsCnqVyL_nXDUbwQAcevei1JF_CHvDthBEhKTP8Wo2U5wnj1NlwFzFVBjblpSNfLuFQvIEj3Qt7v4dk_gVRmm4cIaWiLSofI1axsdz1LaLIswdY-csanCsIct1fIbM2jKpt0UORo0M_m_HvC-F3R1MLZ5JHYGzklV8DA1akzIR4VaeKg/s16000/Snap5.jpg" /></a></div><div class="separator" style="clear: both;"><span style="color: black; font-size: x-small;">圖 5:</span><span style="color: black; font-size: small;">以有序數列填滿的直角三角形</span></div></span></div></h3><h3><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span style="font-weight: 400;">4. </span>04.數字倒三角形<span style="font-weight: 400;">:</span><span style="font-weight: 400;">i 由上到下,每次固定一個值時,讓 j 由左到右掃一次。</span></span></span></div><div class="separator" style="clear: both; text-align: justify;"><span style="font-size: small;"><span style="color: #222222; font-weight: 400; text-align: right;"><span><span><span style="color: black;">將 </span></span></span></span><span style="color: black; font-weight: 400; text-align: left;">Python 程式</span><span style="color: black; font-weight: 400; text-align: left;">轉換妥後</span><span style="color: black; font-weight: 400;">以「</span><span style="color: black; text-align: center;"><span><span style="font-weight: 400; white-space: pre-wrap;">06-04.數字倒三角形.py」存檔執行</span></span></span><span style="color: black; font-weight: 400;">後就能看到</span><span style="color: black; font-weight: 400; text-align: left;">如圖 6</span><span style="color: black; font-weight: 400; text-align: left;"> 所對應的</span><span style="color: black; font-weight: 400;">執行結果。</span></span></div></h3><h3><div class="separator" style="clear: both; font-size: medium; font-weight: 400;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="color: black; font-size: small;"><div></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="text-align: justify;"><span></span></div></div></div></span></span></div></h3><h3><div class="separator" style="clear: both; font-size: medium; font-weight: 400; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><div class="separator" style="clear: both; text-align: justify;"></div></span></div></h3><h3><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span style="font-weight: 400;"></span></span></span></div><div class="separator" style="clear: both; font-weight: 400; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><div class="separator" style="clear: both; font-size: medium;"><br /></div><div class="separator" style="clear: both; font-size: medium; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7b-XFklfBa1susMJd9yt-yzLKgXKk20ag1KvcyoS9Iv8G3uiyrD8xu-tUmy3M71PLDLQoxmSwawGinrkvzTundKkft9gH5Y0L5bKya5byl685F5aO05QMl5QGZMNmEyDY8CyRlsdnta6larxMdUrR4IdUf3Zb1Cn7YLpAOeNKWD_ilqibGRyz8w/s1588/Snap7.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="689" data-original-width="1588" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7b-XFklfBa1susMJd9yt-yzLKgXKk20ag1KvcyoS9Iv8G3uiyrD8xu-tUmy3M71PLDLQoxmSwawGinrkvzTundKkft9gH5Y0L5bKya5byl685F5aO05QMl5QGZMNmEyDY8CyRlsdnta6larxMdUrR4IdUf3Zb1Cn7YLpAOeNKWD_ilqibGRyz8w/s16000/Snap7.jpg" /></a></div><div class="separator" style="clear: both;"><span style="color: black; font-size: x-small;">圖 6:</span><span style="color: black; font-size: small;">以有序數列填滿的倒直角三角形</span></div><div class="separator" style="clear: both; font-size: medium;"><span style="color: black; font-size: small;"></span></div></span></div></h3><h3><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span style="font-weight: 400;">5. </span>05.星號正三角形<span style="font-weight: 400;">:因為輸出的圖形為對稱,所以在圖 7 中我們只考慮左半邊(右半以淺色 * 表示)。</span></span></span></div><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span style="font-weight: 400;">i 的控制仍是由上到下掃瞄,但 j 改成由右到左掃瞄</span><span style="font-weight: 400;">。</span></span></span></div><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span style="font-weight: 400;">觀察圖 7 中左半深色 * 出現的位置:</span></span></span></div><div class="separator" style="clear: both;"><ul><li><span style="color: #222222; font-size: small;"><span style="font-weight: 400;">i = 1, j = 9 時畫 1 顆 *</span></span></li><li><span style="color: #222222; font-size: small;"><span style="font-weight: 400;">i = 2, j = 8 時畫 3 顆 *</span></span></li><li><span style="color: #222222; font-size: small;"><span style="font-weight: 400;">i = 3, j = 7 時畫 5 顆 *</span></span></li><li><span style="color: #222222; font-size: small;"><span style="font-weight: 400;">…</span></span></li></ul><div><br /></div></div><div class="separator" style="clear: both;"><span style="font-size: small;"><span style="font-weight: 400;"><span style="color: #222222;">從以上的觀察,我們可以再套一層迴圈,用變數 </span><span style="color: #6aa84f;">k</span><span style="color: #222222;"> 來控制,</span><span style="color: #6aa84f;">k = 1, 3, 5, 7, ..., 17</span><span style="color: #222222;">。</span></span></span></div><div class="separator" style="clear: both;"><span style="color: #222222; font-size: small;"><span style="font-weight: 400;"><br /></span></span></div><div class="separator" style="clear: both; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span><span style="font-weight: 400;"><div class="separator" style="clear: both; font-size: medium; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjJLFlQ7U8RX5yco1PylshESvooBxjc3iHjBah0PpqVXxmQt5XD8DL9u3vLZMo6g88NkCYSQoXWasz54i6CmJ5yKetF7LQ5wxbDfBZ8Fj6p4Fgf8BtMjCHlvTTXw3RDtvh_9bEQsCWW9gBxvQlpKyBkjQm6SCKqmbiKBvppab2OadVu68EqIH1WIQ" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="489" data-original-width="1136" height="276" src="https://blogger.googleusercontent.com/img/a/AVvXsEjJLFlQ7U8RX5yco1PylshESvooBxjc3iHjBah0PpqVXxmQt5XD8DL9u3vLZMo6g88NkCYSQoXWasz54i6CmJ5yKetF7LQ5wxbDfBZ8Fj6p4Fgf8BtMjCHlvTTXw3RDtvh_9bEQsCWW9gBxvQlpKyBkjQm6SCKqmbiKBvppab2OadVu68EqIH1WIQ=w640-h276" width="640" /></a></div><span style="font-size: x-small;">圖 7:問題解析</span></span></span></span></div><div class="separator" style="clear: both; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span style="font-weight: 400;"><br /></span></span></span></div><div class="separator" style="clear: both; text-align: justify;"><span style="font-size: small;"><span style="color: #222222; font-weight: 400; text-align: right;"><span><span><span style="color: black;">將 </span></span></span></span><span style="color: black; font-weight: 400; text-align: left;">Python 程式</span><span style="color: black; font-weight: 400; text-align: left;">轉換妥後</span><span style="color: black; font-weight: 400;">以「</span><span style="color: black; text-align: center;"><span><span style="font-weight: 400; white-space: pre-wrap;">06-05.星號正三角形.py」存檔執行</span></span></span><span style="color: black; font-weight: 400;">後就能看到</span><span style="color: black; font-weight: 400; text-align: left;">如圖 8</span><span style="color: black; font-weight: 400; text-align: left;"> 所對應的</span><span style="color: black; font-weight: 400;">執行結果。</span></span></div><div class="separator" style="clear: both;"><span style="color: black; font-size: medium; font-weight: 400;"><br /></span></div><div class="separator" style="clear: both; text-align: center;"><span style="color: black; font-size: medium; font-weight: 400;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfTRH_XUg0IhZC0ICyzDLDk-w4thzKs-y6QL1AS7zK9_46ntfyhm3w7xQD-ERhg95A_BiLWa2GrIPFBWBFuhP8OTIEAzNoOWl4BEYHll-2kQcfm3l8XoPKLjEhuGjVjoniaS8mF2RMm61EwVLA9ucUL6lqzKA7T4H8e3mOSoafqCX4C2iyU9e6sQ/s1771/Snap9.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="897" data-original-width="1771" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfTRH_XUg0IhZC0ICyzDLDk-w4thzKs-y6QL1AS7zK9_46ntfyhm3w7xQD-ERhg95A_BiLWa2GrIPFBWBFuhP8OTIEAzNoOWl4BEYHll-2kQcfm3l8XoPKLjEhuGjVjoniaS8mF2RMm61EwVLA9ucUL6lqzKA7T4H8e3mOSoafqCX4C2iyU9e6sQ/s16000/Snap9.jpg" /></a></div></span></div><div class="separator" style="clear: both; text-align: center;"><span style="color: black; font-weight: 400;"><span style="font-size: x-small;">圖 8:以 * 填滿一正三角形</span></span></div></h3></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="text-align: justify;"><span><!--more--></span></div></div></div></div></div></span></div></div><div><div style="background-color: white;"><ol><li style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; margin: 0px 0px 0.25em; padding: 0px; text-align: justify;"><span style="font-size: x-small;"><a href="http://creativecommons.tw/explore" style="background-color: transparent; color: #2288bb; font-family: times, "times new roman", serif; text-decoration-line: none;" target="_blank">六種授權條款</a><span face="arial, tahoma, helvetica, freesans, sans-serif" style="background-color: transparent;">。</span></span></li></ol></div></div>Ted Leehttp://www.blogger.com/profile/03077454870590095355noreply@blogger.com0tag:blogger.com,1999:blog-1468347421357730785.post-2390176341027440942022-08-10T06:23:00.100+08:002022-08-22T07:40:49.681+08:00[micro:bit, 流程圖, fChart] 從流程圖學程式邏輯:使用 fChart<h2 style="text-align: center;"> <span style="text-align: center;">從流程圖學程式邏輯:使用 fChart</span></h2><div style="background-color: white; text-align: center;"><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><a href="https://www.facebook.com/groups/134149180510967/" style="color: #2288bb; text-decoration-line: none;" target="_blank"><span style="font-family: times, "times new roman", serif;">Ted Lee的土饅頭(To Mentor)工坊</span></a></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><div><span style="font-family: times, "times new roman", serif;">Line:ted2016.kpvs</span><br /><span style="font-family: times, "times new roman", serif;">Email:Lct4246@gmail.com</span><br /><span style="font-family: times, "times new roman", serif;"><span style="font-family: "times new roman", serif;">FB</span>:<span style="font-family: "times new roman", serif;">http://gg.gg/</span><span style="color: #00cc00; font-family: "times new roman", serif;">TedLee</span><span style="color: red; font-family: "times new roman", serif;">FB</span><span style="font-family: "times new roman", serif;">/</span></span></div><div><span lang="" style="font-family: times, "times new roman", serif; font-size: 12pt;">Blog<span style="font-family: "times new roman"; font-size: small;">:</span>http://gg.gg/<span style="color: #00cc00;">TedLee</span><span style="color: red;">Blog</span>/</span><br /></div></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><span style="font-family: times, "times new roman", serif;"><br /></span></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><span style="font-family: times, "times new roman", serif;">Aug. 10, 2022</span></div><div><span><span style="color: #222222; font-family: times, "times new roman", serif;"><span style="font-size: 13.2px;"><div class="separator" style="clear: both;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s88/CC.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="31" data-original-width="88" height="31" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s1600/CC.png" width="88" /></a>[1]</div></span></span><div class="separator" style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: left;"><br /></div><div class="separator" style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;"><div class="separator" style="clear: both; text-align: center; white-space: pre-wrap;"><div class="separator"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: justify;"><div dir="auto" style="color: #050505; font-family: "Segoe UI Historic", "Segoe UI", Helvetica, Arial, sans-serif; font-size: 15px; text-align: start;">綜觀各類積木程式(Google Blockly、MIT Scratch、MakeCode…)的學習,學員們拉完/玩積木後是否都已學會了程式設計的「邏輯」了呢?還是只是拼拼湊湊地在玩拼<span style="font-family: inherit;">圖</span>遊戲而已?</div><div dir="auto" style="color: #050505; font-family: "Segoe UI Historic", "Segoe UI", Helvetica, Arial, sans-serif; font-size: 15px; text-align: justify;">程式設計的訓練目在培養<b>解決問題(problem solving)</b>能力(圖 1),在這一方面,陳會安老師以自己研發的流程圖識讀工具 fChart 精編了 150 道題目(<span style="font-family: inherit;"><a class="oajrlxb2 g5ia77u1 qu0x051f esr5mh6w e9989ue4 r7d6kgcz rq0escxv nhd2j8a9 nc684nl6 p7hjln8o kvgmc6g5 cxmmr5t8 oygrvhab hcukyx3x jb3vyjys rz4wbd8a qt6c0cv9 a8nywdso i1ao9s8h esuyzwwr f1sip0of lzcic4wl gpro0wi8 py34i1dx" href="https://l.facebook.com/l.php?u=https%3A%2F%2Freurl.cc%2Fm3G2XW%3Ffbclid%3DIwAR22JPephBDMxCNrPh-6b0EUZZ3OhB8dloR7V-wnvnvlBRBBf35OsVgXURQ&h=AT3ltEQPwmUrPS_4C8OeYXY2SVpFeNGJAcPtt0hfxEUDp8iv87Nuf9Lt2V7N4v3b0N6HwW62WrvS1Ygh3_NSXrwIcT8UrXwdKlLRO5Li7BbDB8AAOG12Bqj_2PvyBorNFvUn&__tn__=-UK-R&c[0]=AT28XkDFIQnXUIHdmcFBuvN2fSGWjjD5kOe3TVxkbo9QPBQO_ygJxpmEzfonQE5OuLNye2-aGRqLCUe-SQgcZl2FnrzHjSiiiHaq7a9etXeDf8gufARKHASdQ8D_ZNmOFU2puK9MEp2mxn95ltkmKyp0BJmY-CrnRFcEiIRcu8c5JSQd79koK8gZIgsLCRMAHFtW50UhgYFqGaxuL1I" rel="nofollow noopener" role="link" style="-webkit-tap-highlight-color: transparent; background-color: transparent; border-color: initial; border-style: initial; border-width: 0px; box-sizing: border-box; cursor: pointer; display: inline; font-family: inherit; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: inherit; text-decoration-line: none; touch-action: manipulation;" tabindex="0" target="_blank">https://reurl.cc/m3G2XW</a></span>) 來協助初學者從流程圖轉換到 Python、C、Java…等各程式語言語法。</div><div dir="auto" style="color: #050505; font-family: "Segoe UI Historic", "Segoe UI", Helvetica, Arial, sans-serif; font-size: 15px; text-align: justify;"><br /></div><div class="separator" style="clear: both; font-size: 13.2px; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEioBjgougmia0J2l-As8CIEVRYmgwhl1EHXtzgk6D3MCx9NlVFUzprj6aosjlp-T-Nk7ddGLwk6Qz9OdjLkHzspJ2NB_OPgg3q3grbpV_lrcTHuCsKekiba-v6c0GXpib0zTxJzbmJM6iZVCjUqD7LaxW79JxzAS8jw4nDdsb2cxO6vKsrChNMEvg/s594/%E5%BE%9E%E6%83%B3%E6%B3%95%EF%BC%88ideas%EF%BC%89%E5%88%B0%E5%AF%A6%E7%8F%BE%EF%BC%88implementation%EF%BC%89.drawio.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="266" data-original-width="594" height="179" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEioBjgougmia0J2l-As8CIEVRYmgwhl1EHXtzgk6D3MCx9NlVFUzprj6aosjlp-T-Nk7ddGLwk6Qz9OdjLkHzspJ2NB_OPgg3q3grbpV_lrcTHuCsKekiba-v6c0GXpib0zTxJzbmJM6iZVCjUqD7LaxW79JxzAS8jw4nDdsb2cxO6vKsrChNMEvg/w400-h179/%E5%BE%9E%E6%83%B3%E6%B3%95%EF%BC%88ideas%EF%BC%89%E5%88%B0%E5%AF%A6%E7%8F%BE%EF%BC%88implementation%EF%BC%89.drawio.png" width="400" /></a></div><div style="font-size: 13.2px; text-align: center;">圖 1:問題解決流程</div><div style="font-size: 13.2px; text-align: center;"><br /></div><div style="font-size: 13.2px; text-align: justify;"><span face=""Segoe UI Historic", "Segoe UI", Helvetica, Arial, sans-serif" style="color: #050505; font-size: 15px;">因此,本文第 1 至 3 小節以問題形式來包裝所有程式語言都會支援的<b>循序結構(sequential structure)</b>、<b>選擇結構(selective structure)</b>和<b>重複結構(repetitive structure)</b>結構化程式設計共通的三大結構來呈現圖 1 的完整解題過程。</span></div><div style="font-size: 13.2px; text-align: justify;"><span face=""Segoe UI Historic", "Segoe UI", Helvetica, Arial, sans-serif" style="color: #050505; font-size: 15px;">在第 4 小節中,我們從 fChart 150 題中選出符合這三大結構的三個示例來說明如何用這 150 題來熟悉圖 1 後半中流程圖識讀並能以 MakeCode 程式來實現的轉換過程。</span></div><div style="font-size: 13.2px; text-align: justify;"><span face=""Segoe UI Historic", "Segoe UI", Helvetica, Arial, sans-serif" style="color: #050505; font-size: 15px;">註:fChart 能用的「有限」流程圖<b>符號(symbols)</b>如圖 2。原作者陳會安老師總是再三強調:就是因為它只有幾個少少的符號,所以將問題解法以流程圖來表達是很容易學會的!</span></div><div style="font-size: 13.2px; text-align: justify;"><span face=""Segoe UI Historic", "Segoe UI", Helvetica, Arial, sans-serif" style="color: #050505; font-size: 15px;"><br /></span></div><div style="text-align: center;"><span face=""Segoe UI Historic", "Segoe UI", Helvetica, Arial, sans-serif" style="color: #050505;"><div class="separator" style="clear: both; font-size: 15px; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEid-ynVke8JPprHv17cWrtcmj4hO3XExIISnhHcONKVW1JyNf7L-4vxYBBqTQkG_ScS_9iK0QxeNt3sOWO3FMxwP7EFJ3wG2TtGAdrmN7PtIbyrBLgbVkBei0YpcQ42FjMdKwj9nRp1Ua_SUPzzvQ3gYPJ5FbuXrmn3c6cuBU5tl5de3Pmo7NnYpw" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="509" data-original-width="96" height="400" src="https://blogger.googleusercontent.com/img/a/AVvXsEid-ynVke8JPprHv17cWrtcmj4hO3XExIISnhHcONKVW1JyNf7L-4vxYBBqTQkG_ScS_9iK0QxeNt3sOWO3FMxwP7EFJ3wG2TtGAdrmN7PtIbyrBLgbVkBei0YpcQ42FjMdKwj9nRp1Ua_SUPzzvQ3gYPJ5FbuXrmn3c6cuBU5tl5de3Pmo7NnYpw=w75-h400" width="75" /></a></div><div class="separator" style="clear: both; text-align: center;"><span style="font-size: x-small;">圖 2:fChart 包含的流呈圖符號</span></div></span></div><span style="font-size: 13.2px;"><span></span></span><span style="font-size: 13.2px;"><a name='more'></a></span><h2 style="text-align: justify;"><span style="font-size: large; text-align: left;"><b>1. 例 1</b></span></h2></div></div></div></div></div></div></div></div></div></div><div class="separator" style="clear: both; text-align: left;"><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify; white-space: pre-wrap;"><div class="separator" style="clear: both; white-space: normal;"><div class="separator" style="clear: both; white-space: pre-wrap;"><ul><li><span style="color: #2b00fe;">問題</span>:讓小彼特(文後皆以此來稱呼 micro:bit)可以呈現<b>心跳(heart beating)</b>的效果。</li><li><span style="color: #2b00fe;">流程圖</span>:以大愛心、小愛心兩圖示 [2] 依序輪流顯示來達到心跳的律動 [3](圖 3)。注意:想法不同,解法就各異,而不同的解法也就會對應出不同的解決流程。</li><li><span style="color: #2b00fe;">實作</span>:以 MakeCode 來實作流程圖的解法如圖 4 所示,圖 3 的兩個步驟分別對應到圖 4 的大小愛心兩塊積木,而且我們可以很清楚地從圖 5 的小彼特<b>模擬器(simulator)</b>中觀看到圖 4 積木程式的執行結果動畫。</li></ul></div><div class="separator" style="clear: both; white-space: pre-wrap;"><br /></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglp8xNqAHmEb8M3KJEK7BZwSelTzAQ6-njwdftpzOZ6QTy8Wr-7LuxkAr2akBnYeQYMDPU-KJsyRxciZqWgPcKSWM5fLty5mZpRv0ew-HtM7ZZ2vyweJoczKexnvnffAF1E-sthjgZ3gu3dMM87fLBOi0Fhpb0IzdtyxJZl2CgjGIMcbL-9x4Aqg/s202/%E7%AC%AC%E4%B8%80%E9%A1%8C%E6%B5%81%E7%A8%8B%E5%9C%96.drawio.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="202" data-original-width="102" height="202" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglp8xNqAHmEb8M3KJEK7BZwSelTzAQ6-njwdftpzOZ6QTy8Wr-7LuxkAr2akBnYeQYMDPU-KJsyRxciZqWgPcKSWM5fLty5mZpRv0ew-HtM7ZZ2vyweJoczKexnvnffAF1E-sthjgZ3gu3dMM87fLBOi0Fhpb0IzdtyxJZl2CgjGIMcbL-9x4Aqg/s1600/%E7%AC%AC%E4%B8%80%E9%A1%8C%E6%B5%81%E7%A8%8B%E5%9C%96.drawio.png" width="102" /></a></div><div class="separator" style="clear: both; text-align: center; white-space: pre-wrap;"><span style="font-family: "Times New Roman"; font-size: x-small;">圖 3:解法流程圖</span><br /><div class="separator" style="clear: both;"><br /></div></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEj0uoQcKLkxLTclZu-0t0asOiyQmqlnv4TsWiT0U6G78bV7t8l8IUylwLAAHcgBKF1G3gmeLh8vFwsBB2nWjWX6cvI8deNmZKVEp02fNu04WuyuPZ4Nb2_gQKWekzcqhYx4CXUxDBVMMipbX40I2xz4luw8f5-I_KlLU4eJwtPJG59O5Hoq79urUA" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="192" data-original-width="178" height="240" src="https://blogger.googleusercontent.com/img/a/AVvXsEj0uoQcKLkxLTclZu-0t0asOiyQmqlnv4TsWiT0U6G78bV7t8l8IUylwLAAHcgBKF1G3gmeLh8vFwsBB2nWjWX6cvI8deNmZKVEp02fNu04WuyuPZ4Nb2_gQKWekzcqhYx4CXUxDBVMMipbX40I2xz4luw8f5-I_KlLU4eJwtPJG59O5Hoq79urUA" width="223" /></a></div><span style="font-family: "Times New Roman";"><span style="font-size: x-small;">圖 4:MakeCode 實做</span></span></div><div class="separator" style="clear: both; text-align: center;"><br /></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjL07tuUdUNGFYVbAYqgNuMB-In3h4afX0o67WC-lUtnljwOLcDmtPPz_jcoEAXfXmdI7ECTP0uIxVdM4Hvd2xruceFTUqZMpOJ57Y3bbJHftFEA52yZQ_64r9BpEB_Agm8fkRMxs5YeBnTnjwqna80j6faOTuE94IVl0XkU7dqcK-zZ0VU4tc28A/s499/%E5%BE%AA%E5%BA%8F%E7%B5%90%E6%A7%8B.gif" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="474" data-original-width="499" height="304" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjL07tuUdUNGFYVbAYqgNuMB-In3h4afX0o67WC-lUtnljwOLcDmtPPz_jcoEAXfXmdI7ECTP0uIxVdM4Hvd2xruceFTUqZMpOJ57Y3bbJHftFEA52yZQ_64r9BpEB_Agm8fkRMxs5YeBnTnjwqna80j6faOTuE94IVl0XkU7dqcK-zZ0VU4tc28A/s320/%E5%BE%AA%E5%BA%8F%E7%B5%90%E6%A7%8B.gif" width="320" /></a></div></div><div class="separator" style="clear: both; text-align: center; white-space: pre-wrap;"><div style="font-family: "Times New Roman"; text-align: justify; white-space: normal;"><h3><div class="separator" style="clear: both; font-weight: 400; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif"><div class="separator" style="clear: both; color: #222222;"><span style="color: black; font-size: x-small;">圖 5:實作結果動畫</span></div><div class="separator" style="clear: both; color: #222222; font-size: medium;"><span style="color: black; font-size: small;"><br /></span></div><div class="separator" style="clear: both; font-size: medium; text-align: justify;">完整的程式碼可由 <a href="https://reurl.cc/gM2qxX">https://reurl.cc/gM2qxX</a> 下載之。</div><div class="separator" style="clear: both; color: #222222; font-size: medium;"><span><!--more--></span></div></span></div></h3></div></div></div></div></div><div class="separator" style="clear: both; text-align: left;"><div class="separator" style="clear: both;"><span style="text-align: justify;"><div class="separator" style="clear: both; text-align: left;"><h2 style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify; white-space: pre-wrap;"><span style="text-align: left;">2. 例 2</span></h2><h2 style="clear: both; text-align: justify;"><div class="separator" style="clear: both; text-align: left;"><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify; white-space: pre-wrap;"><div class="separator" style="clear: both; white-space: normal;"><div class="separator" style="clear: both; font-size: medium; white-space: pre-wrap;"><ul><li><span style="color: #2b00fe; font-weight: 400;">問題</span><span style="font-weight: 400;">:接下 A 按鈕後,讓小彼特</span><span style="font-weight: normal;">心跳一下</span><span style="font-weight: 400;">。</span></li><li style="font-weight: 400;"><span style="color: #2b00fe;">流程圖</span>:<span style="color: red;">當</span>按鈕 A 接下後,顯示大愛心和小愛心圖示一次,如圖 6 所示。</li><li style="font-weight: 400;"><span style="color: #2b00fe;">實作</span>:以 MakeCode 實作後的積木程式如圖 7 所示,其中,心跳完一下應該停止顯示,所以,我們在小愛心圖示之後加上清除的積木。最後,程式的執行動畫如圖 8 所示。</li></ul></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqnJ4kCk5n_LCdu3toWMZoXcGa4_wzWRh7gYmnin65zyIp5RriaigHplVr9Ufk81DRSnpd-Rj2HyI5KdMUCg_oCYqrO_KvcMH0GTlfWwzWhUkKz1H_qjtlTwhi2Rv6P2lBCH6doRI18k7vGQfinR_l6M3uJcTXYzVnys_h6um9EtauSb6aqLuXzg/s352/%E7%AC%AC%E4%BA%8C%E9%A1%8C%E6%B5%81%E7%A8%8B%E5%9C%96.drawio.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="352" data-original-width="220" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqnJ4kCk5n_LCdu3toWMZoXcGa4_wzWRh7gYmnin65zyIp5RriaigHplVr9Ufk81DRSnpd-Rj2HyI5KdMUCg_oCYqrO_KvcMH0GTlfWwzWhUkKz1H_qjtlTwhi2Rv6P2lBCH6doRI18k7vGQfinR_l6M3uJcTXYzVnys_h6um9EtauSb6aqLuXzg/w250-h400/%E7%AC%AC%E4%BA%8C%E9%A1%8C%E6%B5%81%E7%A8%8B%E5%9C%96.drawio.png" width="250" /></a></div><div class="separator" style="clear: both; text-align: center;"><span style="font-family: "Times New Roman"; font-size: small; font-weight: 400; white-space: pre-wrap;">圖 6:解法流程圖</span></div><div class="separator" style="clear: both; font-size: medium; font-weight: 400; white-space: pre-wrap;"><br /></div></div></div></div></h2></div></span></div></div><div class="separator" style="clear: both; text-align: left;"><div class="separator" style="clear: both;"><div style="text-align: justify;"><h3><div class="separator" style="clear: both; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif"><div class="separator" style="clear: both; color: #222222; font-size: medium; font-weight: 400; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRh9RaTkh2q2n22vGsdmLciWSoxKBufIfuZ0KZA_a-XmI6RB7M-78x-hmYE4sfDy_h_jHqDputDfGibuPf_9-SAqcivt_iSPfAMMYRFYcjM0300kyiSZVOaLHgOK1iKKtahsbhipZXELLN0yTjcnfr6E0QQUEnANAzvsq1eViVF49u_2XVOG3nag/s411/%E9%81%B8%E6%93%87%E7%B5%90%E6%A7%8B.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="383" data-original-width="411" height="298" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRh9RaTkh2q2n22vGsdmLciWSoxKBufIfuZ0KZA_a-XmI6RB7M-78x-hmYE4sfDy_h_jHqDputDfGibuPf_9-SAqcivt_iSPfAMMYRFYcjM0300kyiSZVOaLHgOK1iKKtahsbhipZXELLN0yTjcnfr6E0QQUEnANAzvsq1eViVF49u_2XVOG3nag/s320/%E9%81%B8%E6%93%87%E7%B5%90%E6%A7%8B.jpg" width="320" /></a></div><div class="separator" style="clear: both; color: #222222; font-weight: 400; text-align: center;"><span style="font-size: x-small;"><span style="color: black;">圖 7:</span>MakeCode 實做</span></div><div class="separator" style="clear: both; color: #222222; font-size: medium; font-weight: 400; text-align: center;"><br /></div><div class="separator" style="clear: both; color: #222222; font-weight: 400; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvLMgm9uNTLflgm-XgETteOdpkjoJZWtOfFHZOS3Lkcn4zvd2jjWrJE1EYfVayLypFumYOFBMMviFxvjTdxMmtbY6EBDdDJFWAxky2HxxSB6CezlLrLJg7sNfSUzHRiIs-XMNgsq6dVg81H39nJhyX-Zq9S0bPSyalGs32D6p8cikJpxGsRsYgGg/s499/%E9%81%B8%E6%93%87%E7%B5%90%E6%A7%8B.gif" style="font-size: medium; margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="474" data-original-width="499" height="304" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvLMgm9uNTLflgm-XgETteOdpkjoJZWtOfFHZOS3Lkcn4zvd2jjWrJE1EYfVayLypFumYOFBMMviFxvjTdxMmtbY6EBDdDJFWAxky2HxxSB6CezlLrLJg7sNfSUzHRiIs-XMNgsq6dVg81H39nJhyX-Zq9S0bPSyalGs32D6p8cikJpxGsRsYgGg/s320/%E9%81%B8%E6%93%87%E7%B5%90%E6%A7%8B.gif" width="320" /></a><br /><span style="font-size: x-small;"><span style="color: black;">圖 8:</span><span style="color: black;">實作結果動畫</span></span></div><div><br /></div><div class="separator" style="clear: both; text-align: justify;"><span style="font-size: medium; font-weight: 400;">完整的程式碼可由</span><span style="color: #222222; font-size: medium; font-weight: 400;"> </span><a href="https://reurl.cc/jG1AL1" style="font-size: medium; font-weight: 400;">https://reurl.cc/jG1AL1</a><span style="color: #222222; font-size: medium; font-weight: 400;"> </span><span style="font-size: medium; font-weight: 400;">下載之。</span></div></span></div></h3><h2 style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; white-space: pre-wrap;"><span><!--more--></span></h2><h2 style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; white-space: pre-wrap;"><span style="text-align: left;">3. 例 3</span></h2><h2 style="clear: both;"><div class="separator" style="clear: both; font-size: medium; font-weight: 400; text-align: left;"><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify; white-space: pre-wrap;"><div class="separator" style="clear: both; white-space: normal;"><div class="separator" style="clear: both; white-space: pre-wrap;"><ul style="font-weight: 700;"><li><span style="color: #2b00fe; font-weight: 400;">問題</span><span style="font-weight: 400;">:接下 A 按鈕後,讓小彼特</span><span style="font-weight: normal;">心跳三下</span><span style="font-weight: 400;">。</span></li><li style="font-weight: 400;"><span style="color: #2b00fe;">流程圖</span>:當按鈕 A 接下後,<span style="color: red;">重複</span>顯示大愛心和小愛心圖示<span style="color: red;">三次</span>,如圖 9 所示。</li><li style="font-weight: 400;"><span style="color: #2b00fe;">實作</span>:以 MakeCode 實作後的積木程式如圖 10 [4] 所示。程式的執行動畫如圖 11 所示。</li></ul></div><div class="separator" style="clear: both; white-space: pre-wrap;"><br /></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiVcXsUBPHggo4IDF5ioE7uO_rXWMBJihndZXGTSIKfe5kp0ygRNUxImInfsEuJwUZijWSQ_Qmyo7vbGrNmP7dTQgaotNX3hOF4J_0SkvZqAthWmWIGAoo5I70s08b9DjiV6iNHFzFxxaq_mdBDUpDoObDEVXoNy9dOzlMAng72rk6XuEqoFY0iA/s424/%E7%AC%AC%E4%B8%89%E9%A1%8C%E6%B5%81%E7%A8%8B%E5%9C%96.drawio.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="424" data-original-width="236" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiVcXsUBPHggo4IDF5ioE7uO_rXWMBJihndZXGTSIKfe5kp0ygRNUxImInfsEuJwUZijWSQ_Qmyo7vbGrNmP7dTQgaotNX3hOF4J_0SkvZqAthWmWIGAoo5I70s08b9DjiV6iNHFzFxxaq_mdBDUpDoObDEVXoNy9dOzlMAng72rk6XuEqoFY0iA/w223-h400/%E7%AC%AC%E4%B8%89%E9%A1%8C%E6%B5%81%E7%A8%8B%E5%9C%96.drawio.png" width="223" /></a></div><div class="separator" style="clear: both; text-align: center; white-space: pre-wrap;"><span style="color: black; font-family: "Times New Roman"; font-size: small; white-space: normal;">圖 9:</span><span style="font-family: "Times New Roman"; font-size: small;">解法流程圖</span></div><div class="separator" style="clear: both; text-align: center; white-space: pre-wrap;"><span style="font-family: "Times New Roman"; font-size: small; white-space: normal;"><br /></span></div></div></div></div></h2><h3><div class="separator" style="clear: both; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif"><div class="separator" style="clear: both;"><span><div style="font-size: medium; font-weight: 400; text-align: left;"></div></span></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both; color: #222222; font-size: medium; font-weight: 400; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4oSn3ZGc3d-6X21ctYvg8Xc4c58hBqw4z5nI2CZCPwGBH4uf-FPltO-g34y0OljhFC-7F1970_YTq3mthj3aFR4y1sHZIK_TPugrsSmn7A-ekMMBwKKTk0KIoysHnfQTAE4CWIW5oOh9DoiTF-dYB7B-DcTB4sBX7guZ2SOS6hOYdgoTVxGi8eQ/s473/%E9%87%8D%E8%A4%87%E7%B5%90%E6%A7%8B.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="473" data-original-width="412" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4oSn3ZGc3d-6X21ctYvg8Xc4c58hBqw4z5nI2CZCPwGBH4uf-FPltO-g34y0OljhFC-7F1970_YTq3mthj3aFR4y1sHZIK_TPugrsSmn7A-ekMMBwKKTk0KIoysHnfQTAE4CWIW5oOh9DoiTF-dYB7B-DcTB4sBX7guZ2SOS6hOYdgoTVxGi8eQ/w349-h400/%E9%87%8D%E8%A4%87%E7%B5%90%E6%A7%8B.jpg" width="349" /></a></div><div class="separator" style="clear: both; color: #222222; font-weight: 400; text-align: center;"><span style="font-size: x-small;"><span style="color: black;">圖 10:</span><span>MakeCode 實做</span></span></div><div class="separator" style="clear: both; color: #222222; font-size: medium; font-weight: 400; text-align: center;"><br /></div><div class="separator" style="clear: both; color: #222222; font-size: medium; font-weight: 400; text-align: center;"><br /></div><div class="separator" style="clear: both; color: #222222; font-size: medium; font-weight: 400; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdOey87sqApjvoRx9pXtOejMbZ2HrtKF7zJ6THIP5CJJLjUIiodjpd-kwPje6YX5UidNdUtnzydj3nCU0RrYYmuMh_kfFLeT1oXktafe41kvPQso6lfNMEz-MKwsoPZoDABjsD0_UINPehRI88P0GjufMDYBB5lz0J8MVRoHc7LumdAerjnJ3SUw/s499/%E9%87%8D%E8%A4%87%E7%B5%90%E6%A7%8B.gif" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="474" data-original-width="499" height="304" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdOey87sqApjvoRx9pXtOejMbZ2HrtKF7zJ6THIP5CJJLjUIiodjpd-kwPje6YX5UidNdUtnzydj3nCU0RrYYmuMh_kfFLeT1oXktafe41kvPQso6lfNMEz-MKwsoPZoDABjsD0_UINPehRI88P0GjufMDYBB5lz0J8MVRoHc7LumdAerjnJ3SUw/s320/%E9%87%8D%E8%A4%87%E7%B5%90%E6%A7%8B.gif" width="320" /></a></div><span style="font-size: x-small;"><span style="color: black; font-weight: 400;">圖 11:</span><span style="font-weight: 400;">實作結果動畫</span></span></div><div class="separator" style="clear: both;"><span style="font-size: medium;"><span style="font-weight: 400;"><br /></span></span></div><div class="separator" style="clear: both;"><div style="text-align: justify;"><span style="font-size: medium; font-weight: 400;">完整的程式碼可由</span><span style="color: #222222; font-size: medium; font-weight: 400;"> </span><span style="font-weight: 400; text-align: center;"><span style="color: #222222; font-size: small;"><a href="https://reurl.cc/nO1aWn">https://reurl.cc/nO1aWn</a></span></span><span style="color: #222222; font-size: medium; font-weight: 400;"> </span><span style="font-size: medium; font-weight: 400;">下載之。</span></div><div style="text-align: justify;"><span><!--more--></span></div></div></span></div></h3><h2 style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;">4. fChart 的選例</h2><h2 style="clear: both;"><div class="separator" style="clear: both; text-align: left;"><div class="separator" style="clear: both; text-align: justify;"><div class="separator" style="clear: both;"><div style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: medium; white-space: pre-wrap;"><span face=""Segoe UI Historic", "Segoe UI", Helvetica, Arial, sans-serif" style="color: #050505; font-size: 15px; font-weight: 400;">我們從 fChart 150 題(</span><span face=""Segoe UI Historic", "Segoe UI", Helvetica, Arial, sans-serif" style="color: #050505; font-size: 15px; font-weight: 400;"><a class="oajrlxb2 g5ia77u1 qu0x051f esr5mh6w e9989ue4 r7d6kgcz rq0escxv nhd2j8a9 nc684nl6 p7hjln8o kvgmc6g5 cxmmr5t8 oygrvhab hcukyx3x jb3vyjys rz4wbd8a qt6c0cv9 a8nywdso i1ao9s8h esuyzwwr f1sip0of lzcic4wl gpro0wi8 py34i1dx" href="https://l.facebook.com/l.php?u=https%3A%2F%2Freurl.cc%2Fm3G2XW%3Ffbclid%3DIwAR22JPephBDMxCNrPh-6b0EUZZ3OhB8dloR7V-wnvnvlBRBBf35OsVgXURQ&h=AT3ltEQPwmUrPS_4C8OeYXY2SVpFeNGJAcPtt0hfxEUDp8iv87Nuf9Lt2V7N4v3b0N6HwW62WrvS1Ygh3_NSXrwIcT8UrXwdKlLRO5Li7BbDB8AAOG12Bqj_2PvyBorNFvUn&__tn__=-UK-R&c[0]=AT28XkDFIQnXUIHdmcFBuvN2fSGWjjD5kOe3TVxkbo9QPBQO_ygJxpmEzfonQE5OuLNye2-aGRqLCUe-SQgcZl2FnrzHjSiiiHaq7a9etXeDf8gufARKHASdQ8D_ZNmOFU2puK9MEp2mxn95ltkmKyp0BJmY-CrnRFcEiIRcu8c5JSQd79koK8gZIgsLCRMAHFtW50UhgYFqGaxuL1I" rel="nofollow noopener" role="link" style="-webkit-tap-highlight-color: transparent; background-color: transparent; border-color: initial; border-style: initial; border-width: 0px; box-sizing: border-box; cursor: pointer; display: inline; font-family: inherit; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: inherit; text-decoration-line: none; touch-action: manipulation;" tabindex="0" target="_blank">https://reurl.cc/m3G2XW</a></span><span face=""Segoe UI Historic", "Segoe UI", Helvetica, Arial, sans-serif" style="color: #050505; font-size: 15px; font-weight: 400;">) 中,選出循序、選擇與重複三大結構的示例來展示圖 1 後半段(流程圖轉語法)的練習方法。</span></div><h3 style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: medium; white-space: pre-wrap;">A. 循序結構</h3><div style="clear: both;"><ul><li style="font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; white-space: pre-wrap;"><span style="font-weight: normal;"><span style="font-size: small;"><span style="color: #2b00fe;">題目</span>:(01.變數與輸出輸入:01-02輸出二行)顯示 520 後再顯示 1314 [5]。</span></span></li><li><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="font-weight: normal; white-space: pre-wrap;"><span style="font-size: small;"><span style="color: #2b00fe;">MakeCode 程式</span>:如圖 12 所示。完整程式碼可從 </span></span><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="font-size: small;"><span style="font-weight: 400; white-space: pre-wrap;"><a href="https://reurl.cc/2mZpVm" target="_blank">https://reurl.cc/2mZpVm </a>下載之。</span></span></li></ul></div><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: medium; font-weight: 400; white-space: pre-wrap;"><br /></div><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: medium; font-weight: 400; text-align: center; white-space: normal;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhBlNLrye2uppe4Hk3xN-V7IBa-Nc6Hu0ubNWY0oRHsCG3fD7vIcshjqVEb8bcgt6cmE-4kdrh_g4l-1He5MGx-auSZkW5hf7XcKGkwYPMnqYBMj9pOTFLSdigN2RRfx34OMeFwdxTCDN1hZ0yKw9j78BL1tkDjiJQUG7bkoLPMYZFCJ-N-Lhv7dg/s226/01-02%E8%BC%B8%E5%87%BA%E4%BA%8C%E8%A1%8C.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="206" data-original-width="226" height="206" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhBlNLrye2uppe4Hk3xN-V7IBa-Nc6Hu0ubNWY0oRHsCG3fD7vIcshjqVEb8bcgt6cmE-4kdrh_g4l-1He5MGx-auSZkW5hf7XcKGkwYPMnqYBMj9pOTFLSdigN2RRfx34OMeFwdxTCDN1hZ0yKw9j78BL1tkDjiJQUG7bkoLPMYZFCJ-N-Lhv7dg/s1600/01-02%E8%BC%B8%E5%87%BA%E4%BA%8C%E8%A1%8C.jpg" width="226" /></a> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgD34RVMVmiXjNYQEBMyG3JFVf7BHYx2pJhc1xFNgZ0I8mY6W4NWbBNiKVm2-AETR9bv08-kETh0R0AjWnIUaIXBIaMVxl1ZY6xeRD_09ovNlLI2SztdIExhpkyA9HRQ3yGOX6IsLicP4bkne5sZQlOWhlyBGs8awcrLCXRUfNeRZ3RAIvyh6azYQ/s499/01-02%E8%BC%B8%E5%87%BA%E4%BA%8C%E8%A1%8C.gif" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="475" data-original-width="499" height="305" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgD34RVMVmiXjNYQEBMyG3JFVf7BHYx2pJhc1xFNgZ0I8mY6W4NWbBNiKVm2-AETR9bv08-kETh0R0AjWnIUaIXBIaMVxl1ZY6xeRD_09ovNlLI2SztdIExhpkyA9HRQ3yGOX6IsLicP4bkne5sZQlOWhlyBGs8awcrLCXRUfNeRZ3RAIvyh6azYQ/s320/01-02%E8%BC%B8%E5%87%BA%E4%BA%8C%E8%A1%8C.gif" width="320" /></a></div><div class="separator" style="clear: both; text-align: center;"><span style="font-size: x-small;"><span style="color: #222222; font-family: "Times New Roman"; font-weight: 400; white-space: normal;">圖 12:</span><span style="font-weight: 400; text-align: justify;"><span style="color: #222222;">fChart 循序結構選例</span></span></span></div></div></div></div></h2><h3 style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;">B. 選擇結構</h3><div style="clear: both; text-align: left;"><ul style="text-align: left;"><li style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif;"><span style="color: #2b00fe; text-align: justify; white-space: pre-wrap;">題目</span><span style="text-align: justify; white-space: pre-wrap;">:(</span><span style="font-weight: normal;">03.條件判斷:03-01.單選_絕對值)。計算變數 value 的絕對值。</span></li><li style="font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif;"><span style="font-weight: normal;"><span style="color: #2b00fe;">MakeCode 語法積木</span><span style="color: #222222;">:</span><a href="https://blogger.googleusercontent.com/img/a/AVvXsEiLO7wrDHFk-U-mx69VyKXnWBOTo77_Djw7rBV2-iGMq1roEE1J0VWtCwkshUBpz2SftCJNmI4f4njO9DDF-tKK391P5ZgyDrN_NczcDIxGssoU_vyKNaxsHackYPoc05GLhR_FftYg8dTSwvK9AWC3R3ot13253CKVWpBlgn19992sgvhO89EcVw" style="color: #222222; margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="109" data-original-width="181" height="121" src="https://blogger.googleusercontent.com/img/a/AVvXsEiLO7wrDHFk-U-mx69VyKXnWBOTo77_Djw7rBV2-iGMq1roEE1J0VWtCwkshUBpz2SftCJNmI4f4njO9DDF-tKK391P5ZgyDrN_NczcDIxGssoU_vyKNaxsHackYPoc05GLhR_FftYg8dTSwvK9AWC3R3ot13253CKVWpBlgn19992sgvhO89EcVw=w200-h121" width="200" /></a><span style="color: #222222;">。</span></span></li><li><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #2b00fe;">MakeCode 程式</span><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;">:如圖 13 所示。</span><span style="font-size: small;">完整程式碼可從 </span><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="font-size: small; font-weight: 700; text-align: justify;"><span style="font-weight: 400; white-space: pre-wrap;"><a href="https://reurl.cc/yMrza6" target="_blank">https://reurl.cc/yMrza6</a>下載之。</span></span></li></ul></div><h2 style="clear: both;"><div class="separator" style="clear: both; font-weight: 400; text-align: left;"><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify; white-space: pre-wrap;"><div class="separator" style="clear: both; white-space: normal;"><div class="separator" style="clear: both; font-size: medium; white-space: pre-wrap;"><br /></div><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="font-size: small;"><br /></span><div class="separator" style="clear: both; font-size: medium; text-align: center;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRUf73BCwvnKggxSxAgcaTkKd-bjjK_3Iv3BNXhS01cLgCwX45SDSXWupseR2hADZnPe_xH6Y3pMfb8lvvB9v_Rd8koW33_XEEJd2kagCFBHXz7q0-uSoaDfRpL8XswIKDOPaV_6ex3LVt564S07TAQ2f8QNaL6qq_5zyDV8L5eVvFkjguxp0RFA/s458/03-01%E5%96%AE%E9%81%B8_%E7%B5%95%E5%B0%8D%E5%80%BC.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="370" data-original-width="458" height="259" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRUf73BCwvnKggxSxAgcaTkKd-bjjK_3Iv3BNXhS01cLgCwX45SDSXWupseR2hADZnPe_xH6Y3pMfb8lvvB9v_Rd8koW33_XEEJd2kagCFBHXz7q0-uSoaDfRpL8XswIKDOPaV_6ex3LVt564S07TAQ2f8QNaL6qq_5zyDV8L5eVvFkjguxp0RFA/s320/03-01%E5%96%AE%E9%81%B8_%E7%B5%95%E5%B0%8D%E5%80%BC.jpg" width="320" /></a><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4B_GOrHb78p8K4OZXWXr9llm1JASzx3IRt2Hqnni8ScT0cN0vLzgOm7O85ZVYnRu4eB8nGDiAFAMttnHLs3r-o4N7FTBEliG5zw9G3t_4fnDhtc8nNUZUXGcuSwDhGqUBteyLezjhk9vkelMIw_ccGzXOBbvQXb4ITJKV6Pv26pfaa3l9y2O7_w/s499/03-01%E5%96%AE%E9%81%B8_%E7%B5%95%E5%B0%8D%E5%80%BC.gif" style="font-family: "Times New Roman"; font-size: 24px; font-weight: 700; margin-left: 1em; margin-right: 1em; white-space: normal;"><img border="0" data-original-height="475" data-original-width="499" height="305" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4B_GOrHb78p8K4OZXWXr9llm1JASzx3IRt2Hqnni8ScT0cN0vLzgOm7O85ZVYnRu4eB8nGDiAFAMttnHLs3r-o4N7FTBEliG5zw9G3t_4fnDhtc8nNUZUXGcuSwDhGqUBteyLezjhk9vkelMIw_ccGzXOBbvQXb4ITJKV6Pv26pfaa3l9y2O7_w/s320/03-01%E5%96%AE%E9%81%B8_%E7%B5%95%E5%B0%8D%E5%80%BC.gif" width="320" /></a></div></div><div class="separator" style="clear: both; font-family: "Times New Roman"; font-weight: 700; text-align: center; white-space: normal;"><span style="font-size: x-small;"><span style="color: #222222; font-weight: 400;">圖 13:</span><span style="font-weight: 400; text-align: justify;"><span style="color: #222222;">fChart 選擇結構選例</span></span></span></div></div></div></div></div></h2><h3 style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;">C. 重複結構</h3><div style="clear: both; text-align: left;"><ul style="text-align: left;"><li style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif;"><span style="color: #2b00fe; text-align: justify; white-space: pre-wrap;">題目</span><span style="text-align: justify; white-space: pre-wrap;">:(</span><span style="font-weight: normal;">04.迴圈結構:04-01.前測_顯示5次大家好)。重複顯示五次「Hi」。</span></li><li style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif;"><span style="color: #2b00fe;">MakeCode 語法積木</span><span style="color: #222222;">:<a href="https://blogger.googleusercontent.com/img/a/AVvXsEhuEvw8I7e8G463RWO7gMp8GYJZjit0WTQL4dtcT-Y-V55YKOL6o8i3ftOjJckzU-uWPJZ0E0AMvXF0VVM6_5wa1pCPkiRgs54SBtv8OJTeMHtKpHPt4SKdVVBQihOaOmJGb6saVx1zxGnweZ1W_DhJM1lECbK4nVk9I45aaAkQqRE99seNm7gCig" style="margin-left: 1em; margin-right: 1em; text-align: center;"><img alt="" data-original-height="108" data-original-width="160" height="135" src="https://blogger.googleusercontent.com/img/a/AVvXsEhuEvw8I7e8G463RWO7gMp8GYJZjit0WTQL4dtcT-Y-V55YKOL6o8i3ftOjJckzU-uWPJZ0E0AMvXF0VVM6_5wa1pCPkiRgs54SBtv8OJTeMHtKpHPt4SKdVVBQihOaOmJGb6saVx1zxGnweZ1W_DhJM1lECbK4nVk9I45aaAkQqRE99seNm7gCig=w200-h135" width="200" /></a></span><span style="color: #222222;">。</span></li><li><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #2b00fe;">MakeCode 程式</span><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;">:如圖 14 所示。</span><span style="font-size: small;">完整程式碼可從 <a href="https://reurl.cc/bE2086" target="_blank">https://reurl.cc/bE2086 </a></span><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: black; font-size: small; font-weight: 700; text-align: justify;"><span style="font-weight: 400; white-space: pre-wrap;">下載之。</span></span></li></ul></div><h2 style="clear: both;"><div class="separator" style="clear: both; text-align: left;"><div class="separator" style="clear: both; text-align: justify;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: medium; font-weight: 400; white-space: pre-wrap;"><br /></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: medium; font-weight: 400; text-align: center; white-space: pre-wrap;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjU0aob_BZNHVe0UY2rGChLgOTY74kJuiCnJt5UDjE038fV0CdbEkRvUHAGDahUWMp5zQ0pzjEs_R1KLmbe1CuiINRbaCP5lJMGFz3knP3XSgE0n7YZQ-KN676XtSh3vasNVjIkZwHXApgDoyObalsQpWCuJug_oPB8BuBFGYCmUr3woFrht7yl2g/s665/01%E5%89%8D%E6%B8%AC_%E9%A1%AF%E7%A4%BA5%E6%AC%A1%E5%A4%A7%E5%AE%B6%E5%A5%BD.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="665" data-original-width="329" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjU0aob_BZNHVe0UY2rGChLgOTY74kJuiCnJt5UDjE038fV0CdbEkRvUHAGDahUWMp5zQ0pzjEs_R1KLmbe1CuiINRbaCP5lJMGFz3knP3XSgE0n7YZQ-KN676XtSh3vasNVjIkZwHXApgDoyObalsQpWCuJug_oPB8BuBFGYCmUr3woFrht7yl2g/w198-h400/01%E5%89%8D%E6%B8%AC_%E9%A1%AF%E7%A4%BA5%E6%AC%A1%E5%A4%A7%E5%AE%B6%E5%A5%BD.jpg" width="198" /></a><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzwHYoCVQygQqyo5SFkc9CISFRY1Z1xHRYMw9WpQ1zVhXBXIn8icqOwszwBPSCwtgq5CNLHFn8-gH5sf2wJHIKHO9maU1oxInwS5ZQ9Dhxm-SX55vE5Gc6GvXfcxcMI2msUNny9P21ZZT-8C3rwL-fvnTD6HzlXOl3xAshRWb_W13u3ERYH9P4rQ/s499/01%E5%89%8D%E6%B8%AC_%E9%A1%AF%E7%A4%BA5%E6%AC%A1%E5%A4%A7%E5%AE%B6%E5%A5%BD.gif" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="475" data-original-width="499" height="305" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzwHYoCVQygQqyo5SFkc9CISFRY1Z1xHRYMw9WpQ1zVhXBXIn8icqOwszwBPSCwtgq5CNLHFn8-gH5sf2wJHIKHO9maU1oxInwS5ZQ9Dhxm-SX55vE5Gc6GvXfcxcMI2msUNny9P21ZZT-8C3rwL-fvnTD6HzlXOl3xAshRWb_W13u3ERYH9P4rQ/s320/01%E5%89%8D%E6%B8%AC_%E9%A1%AF%E7%A4%BA5%E6%AC%A1%E5%A4%A7%E5%AE%B6%E5%A5%BD.gif" width="320" /></a></div><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-weight: 400; text-align: center; white-space: pre-wrap;"><span style="font-size: x-small;"><span style="color: #222222; font-family: "Times New Roman"; white-space: normal;">圖 14:</span><span style="font-family: "Times New Roman"; text-align: justify; white-space: normal;"><span style="color: #222222;">fChart 重複結構選例</span></span></span></div><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: medium; font-weight: 400; text-align: center; white-space: pre-wrap;"><br /></div><div class="separator" style="clear: both; text-align: justify;"><span style="font-size: small;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif"><span style="font-weight: 400; white-space: pre-wrap;">fChart 150 題把各種程式語言裡「共通」的內容</span></span><span style="font-weight: 400; white-space: pre-wrap;">從基礎到進階</span><span style="font-weight: 400; white-space: pre-wrap;">彙編成一道一道的基本功練習:讀懂流程圖,用對應程式語法實現。這樣的練習有助於用最短的時間熟悉任何程式語言</span><span style="white-space: pre-wrap;">語法(syntax)</span><span style="font-weight: 400; white-space: pre-wrap;">的七成以上內涵。然而,語法只是表達的工具,在<span style="color: red;">解決問題</span>的任務下,<span style="color: red;">想法邏輯</span>的訓練才是最關鍵的基礎能力喔!</span></span></div></div></div></div></div></div></h2></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="text-align: justify;"><span><!--more--></span></div></div></div></div></div></span></div></div><div><div style="background-color: white;"><ol><li style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; margin: 0px 0px 0.25em; padding: 0px; text-align: justify;"><span style="font-size: x-small;"><a href="http://creativecommons.tw/explore" style="background-color: transparent; color: #2288bb; font-family: times, "times new roman", serif; text-decoration-line: none;" target="_blank">六種授權條款</a><span face="arial, tahoma, helvetica, freesans, sans-serif" style="background-color: transparent;">。</span></span></li><li style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; margin: 0px 0px 0.25em; padding: 0px; text-align: justify;"><span style="font-size: x-small;"><span face="arial, tahoma, helvetica, freesans, sans-serif" style="background-color: transparent;">能否改成先顯示小愛心,再接著顯示大愛心呢?</span></span></li><li style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; margin: 0px 0px 0.25em; padding: 0px; text-align: justify;"><span style="font-size: x-small;"><span face="arial, tahoma, helvetica, freesans, sans-serif" style="background-color: transparent;">如果能加上噗通噗通的心跳聲更棒!</span></span></li><li style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; margin: 0px 0px 0.25em; padding: 0px; text-align: justify;"><span style="font-size: x-small;"><span face="arial, tahoma, helvetica, freesans, sans-serif" style="background-color: transparent;">可否將清除顯示的積木移出迴圈呢?Why or why not?</span></span></li><li style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; margin: 0px 0px 0.25em; padding: 0px; text-align: justify;"><span style="font-size: x-small;"><span face="arial, tahoma, helvetica, freesans, sans-serif" style="background-color: transparent;">因小彼特主板未配接有鍵盤,我們將題目中輸入的部份都<b>直接寫死在程式中(hard coding)</b>。</span></span></li></ol></div></div>Ted Leehttp://www.blogger.com/profile/03077454870590095355noreply@blogger.com0tag:blogger.com,1999:blog-1468347421357730785.post-76357894871999378312022-08-06T20:34:00.000+08:002022-08-06T20:34:01.697+08:00[micro:bit, 電子學] 小彼特 V2 版之科普電子學:觸控(touch sensing)<h2 style="text-align: center;"> <span style="text-align: center;"><b>小彼特 V2 版之科普電子學:觸控(touch sensing)</b></span></h2><div style="background-color: white; text-align: center;"><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><a href="https://www.facebook.com/groups/134149180510967/" style="color: #2288bb; text-decoration-line: none;" target="_blank"><span style="font-family: times, "times new roman", serif;">Ted Lee的土饅頭(To Mentor)工坊</span></a></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><div><span style="font-family: times, "times new roman", serif;">Line:ted2016.kpvs</span><br /><span style="font-family: times, "times new roman", serif;">Email:Lct4246@gmail.com</span><br /><span style="font-family: times, "times new roman", serif;"><span style="font-family: "times new roman", serif;">FB</span>:<span style="font-family: "times new roman", serif;">http://gg.gg/</span><span style="color: #00cc00; font-family: "times new roman", serif;">TedLee</span><span style="color: red; font-family: "times new roman", serif;">FB</span><span style="font-family: "times new roman", serif;">/</span></span></div><div><span lang="" style="font-family: times, "times new roman", serif; font-size: 12pt;">Blog<span style="font-family: "times new roman"; font-size: small;">:</span>http://gg.gg/<span style="color: #00cc00;">TedLee</span><span style="color: red;">Blog</span>/</span><br /></div></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><span style="font-family: times, "times new roman", serif;"><br /></span></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><span style="font-family: times, "times new roman", serif;">Aug. 6, 2022</span></div><div><span><span style="color: #222222; font-family: times, "times new roman", serif;"><span style="font-size: 13.2px;"><div class="separator" style="clear: both;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s88/CC.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="31" data-original-width="88" height="31" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s1600/CC.png" width="88" /></a>[1]</div></span></span><div class="separator" style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: left;"><br /></div><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify;"><span style="color: #222222;">接</span></div><div class="separator" style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;"><div class="separator" style="clear: both; text-align: center; white-space: pre-wrap;"><div class="separator"><div class="separator" style="clear: both; font-size: 13.2px;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"><span style="font-size: small;">圖 1:10 大項目之 5</span></div></div></div></div></div></div></div></div></div><div class="separator" style="clear: both; text-align: center; white-space: pre-wrap;"><span><a name='more'></a></span></div></div><h2 style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;">原</h2><div class="separator" style="clear: both; text-align: left;"><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify; white-space: pre-wrap;"><div class="separator" style="clear: both; white-space: normal;"><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="color: #222222;">我</span>。</div></div></div></div><div class="separator" style="clear: both; text-align: left;"><div class="separator" style="clear: both;"><span style="text-align: justify;"><div class="separator" style="clear: both; text-align: left;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; text-align: justify;"><div class="separator" style="clear: both; font-weight: bold; text-align: left;"><span><!--more--></span></div><div class="separator" style="clear: both; font-weight: bold; text-align: left;"><h2 style="clear: both;"></h2></div></span></div><div class="separator" style="clear: both; text-align: left;"><h2 style="clear: both; text-align: justify;"><span style="color: #222222; text-align: left;">流</span></h2></div></span></div></div><div class="separator" style="clear: both; text-align: left;"><div class="separator" style="clear: both;"><div style="text-align: justify;"><h3><div class="separator" style="clear: both; font-size: medium; font-weight: 400; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><div class="separator" style="clear: both; text-align: justify;"><br /></div><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both;"><span style="color: black; font-size: small;">圖 3:判斷 n 是否為質數</span></div></span></div></h3></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="text-align: justify;"><span><!--more--></span></div></div></div></div></div></span></div></div><div><div style="background-color: white;"><ol><li style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; margin: 0px 0px 0.25em; padding: 0px; text-align: justify;"><span style="font-size: x-small;"><a href="http://creativecommons.tw/explore" style="background-color: transparent; color: #2288bb; font-family: times, "times new roman", serif; text-decoration-line: none;" target="_blank">六種授權條款</a><span face="arial, tahoma, helvetica, freesans, sans-serif" style="background-color: transparent;">。</span></span></li></ol></div></div>Ted Leehttp://www.blogger.com/profile/03077454870590095355noreply@blogger.com0tag:blogger.com,1999:blog-1468347421357730785.post-30184784153273936562022-07-20T15:27:00.034+08:002022-08-06T20:42:43.109+08:00[fChart, Python] 以 fChart 馭 Python:迴圈和條件(6/11)<h1 style="text-align: center;">以 fChart 馭 Python:</h1><h3 style="text-align: center;">迴圈和條件(6/11)</h3><div style="background-color: white; text-align: center;"><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><a href="https://www.facebook.com/groups/134149180510967/" style="color: #2288bb; text-decoration-line: none;" target="_blank"><span style="font-family: times, "times new roman", serif;">Ted Lee的土饅頭(To Mentor)工坊</span></a></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><div><span style="font-family: times, "times new roman", serif;">Line:ted2016.kpvs</span><br /><span style="font-family: times, "times new roman", serif;">Email:Lct4246@gmail.com</span><br /><span style="font-family: times, "times new roman", serif;"><span style="font-family: "times new roman", serif;">FB</span>:<span style="font-family: "times new roman", serif;">http://gg.gg/</span><span style="color: #00cc00; font-family: "times new roman", serif;">TedLee</span><span style="color: red; font-family: "times new roman", serif;">FB</span><span style="font-family: "times new roman", serif;">/</span></span></div><div><span lang="" style="font-family: times, "times new roman", serif; font-size: 12pt;">Blog<span style="font-family: "times new roman"; font-size: small;">:</span>http://gg.gg/<span style="color: #00cc00;">TedLee</span><span style="color: red;">Blog</span>/</span><br /></div></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><span style="font-family: times, "times new roman", serif;"><br /></span></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><span style="font-family: times, "times new roman", serif;">July 20, 2022</span></div><div><span><span style="color: #222222; font-family: times, "times new roman", serif;"><span style="font-size: 13.2px;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s88/CC.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="31" data-original-width="88" height="31" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGVThCWsqewSh-DihguC0KWdi83qS5xFcd3q9ElEWUj0Y7IiW1MumE3FnLrcJUUgdlyYzhLb4bm2DmQgDYIaxkiMXBxALfUsCQsfRD6Itw6zX2J4X2yZ0rv7fCXE5VnTRiGMvEoF8MITUX-A3wT0jyA8Koclpljsx3KhN_tbqpEw1vlDOGW1akQ/s1600/CC.png" width="88" /></a>[1]</div></span></span><div class="separator" style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: left;"><br /></div><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify;"><span style="color: #222222;">接續著本 fChart 系列前文《<a href="https://lct4246.blogspot.com/2021/12/fchart-python-fchart.html" target="_blank">以 fChart 馭 Python:練 fChart 了沒?(1/11)</a>》(<a href="https://reurl.cc/oeDGN3">https://reurl.cc/oeDGN3</a>),我們將針對</span>圖1 的「10 大項目之 5」<span style="color: #222222;">的 4 個實例</span><span style="color: #222222; text-align: center; white-space: pre-wrap;">(可從<a href="https://drive.google.com/file/d/1qf7XoghILFwd7ZLICJ26F8ChoOge5DlW/view?usp=sharing" target="_blank">此處</a> </span><span style="color: #222222; text-align: center; white-space: pre-wrap;"> 下載)</span><span style="color: #222222;">,從</span></div><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;"><span></span><blockquote style="text-align: center;"><span></span><span></span><span></span><span></span><span></span><span></span><blockquote><span></span></blockquote></blockquote><blockquote><blockquote style="text-align: center;"><blockquote><span>原始問題描述</span><span>到</span><span>以流程圖表達解法</span><span>,</span></blockquote></blockquote><blockquote style="text-align: center;"><blockquote><span>再對照流程圖寫出 Python 語法程式</span></blockquote></blockquote></blockquote><blockquote style="text-align: center;"><blockquote><span></span></blockquote><span></span><blockquote><span></span></blockquote><span></span></blockquote><blockquote style="text-align: center;"><span></span></blockquote><blockquote style="text-align: center;"><span></span></blockquote><blockquote style="text-align: justify;"><span></span></blockquote><span></span></div><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify;"><span style="color: #222222;">的過程詳細說明整個</span><span style="color: #222222;">的</span><b><span style="color: #222222;">問題解決</span><span style="color: #222222; white-space: pre-wrap;">(problem solving)</span></b><span style="color: #222222;">過程。</span></div><div class="separator" style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;"><div class="separator" style="clear: both; text-align: center; white-space: pre-wrap;"><div class="separator"><div class="separator" style="clear: both; font-size: 13.2px;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><br /></div></div><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjH4EX7u84z6bH9axbopw_-hu84KBAT3_O4DWd1u2OoafIvQ9tuZ8-HN_vYmLWRQ9nmoecIfdGduJxp6K4d5FNce0bahTTsYWhltg49tWqiM4vCJ8Lty1S6GYKnMht6ZWIlHK9mBj9MCq6tyjFGFJ4KxC9imLtqkC8l1kfRzbYPMP9R7Lq5RE7Agw/s543/Snap1.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="136" data-original-width="543" height="80" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjH4EX7u84z6bH9axbopw_-hu84KBAT3_O4DWd1u2OoafIvQ9tuZ8-HN_vYmLWRQ9nmoecIfdGduJxp6K4d5FNce0bahTTsYWhltg49tWqiM4vCJ8Lty1S6GYKnMht6ZWIlHK9mBj9MCq6tyjFGFJ4KxC9imLtqkC8l1kfRzbYPMP9R7Lq5RE7Agw/s320/Snap1.png" width="320" /></a></div><div class="separator" style="clear: both; text-align: center;"><span style="font-size: small;">圖 1:10 大項目之 5</span></div></div></div></div></div></div></div></div></div><div class="separator" style="clear: both; text-align: center; white-space: pre-wrap;"><span><a name='more'></a></span></div></div><h2 style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;">原始問題</h2><div class="separator" style="clear: both; text-align: left;"><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify; white-space: pre-wrap;"><div class="separator" style="clear: both; white-space: normal;"><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="color: #222222;">我們試圖把會安老師編排的範例一一還原到初始的問題形式來帶領讀者們思考:</span></div><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="color: #222222;"><br /></span></div><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="color: #2b00fe;"></span><blockquote><span style="color: #2b00fe;">問題</span><span style="color: #222222;"> --- </span><span style="color: red;">流程圖</span><span style="color: #222222;"> ---> </span><span style="color: #2b00fe;">解法</span></blockquote><span style="color: #2b00fe;"></span></div><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="color: #222222;"><br /></span></div><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="color: #222222;">一連串的</span><span style="color: #222222;">問題解決</span><span style="color: #222222;">奇幻之旅。筆者再次強調,</span></div><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="color: #222222;"><br /></span></div><div class="separator" style="clear: both; white-space: pre-wrap;"><span style="color: #222222;"><blockquote>「解決問題」是編程訓練的終極目的,而「流程圖」乃為邏輯表達之母(積木拼圖x湊答案不是)。</blockquote></span></div></div></div><span style="color: #222222;"><h4></h4></span><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; text-align: justify;">1. <b>01.猜數字遊戲</b>:人和電腦玩。玩家輸入一數字來猜電腦的底牌,兩者相同就猜中答案;否則就繼續猜到中為止<a href="https://blogger.googleusercontent.com/img/a/AVvXsEiVfgisrlDBoaN26uuJPqz36VmW-rZchnzyd0140R0q_i2gnrzcBXB5K-V0EjTIbiQdvypf4h-vL_37B9p7-EGKDn2HImxARzotWF2xIBWjq95D_GTnNp-aQl2YFyPyLtT2uQq8OQRMuEIMBxXYU1yVkEgUauVa_3ZO80zwc_VYIp8OanPh7_yH7A" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="285" data-original-width="268" height="240" src="https://blogger.googleusercontent.com/img/a/AVvXsEiVfgisrlDBoaN26uuJPqz36VmW-rZchnzyd0140R0q_i2gnrzcBXB5K-V0EjTIbiQdvypf4h-vL_37B9p7-EGKDn2HImxARzotWF2xIBWjq95D_GTnNp-aQl2YFyPyLtT2uQq8OQRMuEIMBxXYU1yVkEgUauVa_3ZO80zwc_VYIp8OanPh7_yH7A" width="226" /></a></span><span style="text-align: justify;">。</span></div><div class="separator" style="clear: both; text-align: left;"><span style="text-align: justify;">2. <b>02.因數分解</b>:計算正整數的所有<b>因數</b></span><b style="text-align: justify;">(factor)</b><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgftB75Yb9UtcdlvddCa3L1TnnCm_we-gbKUKt5D3GSFPn1PvHTH0lScOZBoB-4psgP-NGiU7houYIiu_VgsLqK21NfR9VOcOUdnodaT3z1tlUMzS9LX1mbq6JdsaBIvvcaw-rG_aTSHFTyx0mugS1l90PKQFmM74Wje2mGXdHaZo8Ep3DwXB_Cog/s251/Snap1.png" style="margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" data-original-height="151" data-original-width="251" height="151" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgftB75Yb9UtcdlvddCa3L1TnnCm_we-gbKUKt5D3GSFPn1PvHTH0lScOZBoB-4psgP-NGiU7houYIiu_VgsLqK21NfR9VOcOUdnodaT3z1tlUMzS9LX1mbq6JdsaBIvvcaw-rG_aTSHFTyx0mugS1l90PKQFmM74Wje2mGXdHaZo8Ep3DwXB_Cog/s1600/Snap1.png" width="251" /></a><span style="text-align: justify;">。註:</span><span style="text-align: justify;">因數</span><span style="text-align: justify;">的概念在 108 新課綱是排在國小數學高年級階段教授(</span><a href="https://reurl.cc/2D8q2X" style="text-align: justify;">https://reurl.cc/2D8q2X</a><span style="text-align: justify;">) 。</span></div><div class="separator" style="clear: both; text-align: left;"><span style="text-align: justify;">3. <b>03.質數判斷</b>:</span><span style="text-align: justify;">計算某一正整數</span><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtUld4YEZA8Pf6UzCyBFNfuSNQI-I4Z9Up692ukfdzqGHWWDxIvuhNUISPX0jh-_sSd8WdOmkEyighefa0LP76aGDV6LXufVerGv14HDI0mxPonbJQZNOlSzPBbGtJHu5l1m_n-Xy3h_JFlGxnIQ7kpzpUMyz4ERxJrH9CL3h6woloU0q7T82e3g/s199/Snap3.png" style="margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" data-original-height="99" data-original-width="199" height="99" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtUld4YEZA8Pf6UzCyBFNfuSNQI-I4Z9Up692ukfdzqGHWWDxIvuhNUISPX0jh-_sSd8WdOmkEyighefa0LP76aGDV6LXufVerGv14HDI0mxPonbJQZNOlSzPBbGtJHu5l1m_n-Xy3h_JFlGxnIQ7kpzpUMyz4ERxJrH9CL3h6woloU0q7T82e3g/s1600/Snap3.png" width="199" /></a>是否為質數<span style="text-align: justify;">。</span><span style="text-align: justify;">註:</span><span style="text-align: justify;"><b>質數(prime)</b></span><span style="text-align: justify;">的概念在 108 新課綱是排在國小數學高年級階段教授(</span><a href="https://reurl.cc/2D8q2X" style="text-align: justify;">https://reurl.cc/2D8q2X</a><span style="text-align: justify;">) 。</span></div><div class="separator" style="clear: both; text-align: left;"><span style="text-align: justify;">4. <b>04.開根號</b>:</span><span style="text-align: justify;">計算某一正整數</span><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJNjllHSFEvbtPCN8V-tFoXsATeiOvxqxOmBXOGkKi2jbzpncWlfwYELYIH939iE8wV0IIjaw6SeaLWUv7x3HT-FCt-rvk-Rnq6a82GzrIlj1eFnPABsD0wdKINVKnPYJmOmbD06i6B2OBqF_EVhjtjBTdEU6hmPEnyuZc1bCKw8LitpkGUFGXpw/s295/Snap6.png" style="margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" data-original-height="100" data-original-width="295" height="100" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJNjllHSFEvbtPCN8V-tFoXsATeiOvxqxOmBXOGkKi2jbzpncWlfwYELYIH939iE8wV0IIjaw6SeaLWUv7x3HT-FCt-rvk-Rnq6a82GzrIlj1eFnPABsD0wdKINVKnPYJmOmbD06i6B2OBqF_EVhjtjBTdEU6hmPEnyuZc1bCKw8LitpkGUFGXpw/s1600/Snap6.png" width="295" /></a><b>平方根(square root)</b><span style="text-align: justify;">。</span><span style="text-align: justify;">註:</span><span style="text-align: justify;"><b>根號</b>/<b>根式</b></span><span style="text-align: justify;">的概念在 108 新課綱是排在國中數學階段教授(</span><a href="https://reurl.cc/2D8q2X" style="text-align: justify;">https://reurl.cc/2D8q2X</a><span style="text-align: justify;">) 。</span></div><div class="separator" style="clear: both; text-align: left;"><div class="separator" style="clear: both;"><span style="text-align: justify;"><div class="separator" style="clear: both; text-align: left;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; text-align: justify;"><div class="separator" style="clear: both; font-weight: bold; text-align: left;"><span><!--more--></span></div><div class="separator" style="clear: both; font-weight: bold; text-align: left;"><h2 style="clear: both;"></h2></div></span></div><div class="separator" style="clear: both; text-align: left;"><h2 style="clear: both; text-align: justify;"><span style="color: #222222; text-align: left;">流程圖與 Python 語法對轉</span></h2></div></span></div></div><div class="separator" style="clear: both; text-align: left;"><div class="separator" style="clear: both;"><div style="text-align: justify;"><h3><div class="separator" style="clear: both; font-size: medium; font-weight: 400;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;">1. <b>01.猜數字遊戲</b>:電腦先隨機產生底牌 target,再由鍵盤輸入要猜的數字 guess。如果底牌大,則顯示數字太大;如果底牌小,則顯示數字太小;如果底牌和猜的數字一樣,則顯示猜中數字。其中,因為此遊戲可以重複玩,所以,我們將要判斷大小的程式碼置於 while 迴圈中。而此迴圈使用「旗標(flag)」技巧,只會在玩家猜中電腦底牌時舉旗(True),致使迴圈跳出,讓遊戲結束。</span></div><div class="separator" style="clear: both; font-size: medium; font-weight: 400;"><span style="color: #222222; text-align: right;"><span><span><span style="color: black;">將 </span></span></span></span><span style="color: black; text-align: left;">Python 程式</span><span style="color: black; text-align: left;">轉換妥後</span><span style="color: black;">以「</span><span style="color: black; text-align: center;"><span style="white-space: pre-wrap;">01.猜數字遊戲.py」存檔執行</span></span><span style="color: black;">後就能看到</span><span style="color: black; text-align: left;">如圖 1</span><span style="color: black; text-align: left;"> 所對應的</span><span style="color: black;">執行結果。</span></div><div class="separator" style="clear: both; font-size: medium; font-weight: 400;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><br /></span></div><div class="separator" style="clear: both; font-size: medium; font-weight: 400; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjRhVLOO_JyndrTDQGLRTTkS2pZrHtW7CMwuUmH9LrIUxiu9Vs0UlFguOIFa2s9z32yn5xXWodl1A_6XIeFnJJu9QM8o0fawW7URs9CO3zMARAeBilJMTDE2r8A-dz5FiZ_4FtWUDr61B0aOhdPi1UeHM01ri13ll5l0mIf7TdPzwXuuJ6lHw5ndg" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="928" data-original-width="1519" src="https://blogger.googleusercontent.com/img/a/AVvXsEjRhVLOO_JyndrTDQGLRTTkS2pZrHtW7CMwuUmH9LrIUxiu9Vs0UlFguOIFa2s9z32yn5xXWodl1A_6XIeFnJJu9QM8o0fawW7URs9CO3zMARAeBilJMTDE2r8A-dz5FiZ_4FtWUDr61B0aOhdPi1UeHM01ri13ll5l0mIf7TdPzwXuuJ6lHw5ndg=s16000" /></a></div></span></div><div class="separator" style="clear: both; font-weight: 400; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="color: black; font-size: x-small;">圖 1:猜數字、比大小</span></span></div><div class="separator" style="clear: both; font-size: medium; font-weight: 400; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="color: black; font-size: small;"><br /></span></span></div><div class="separator" style="clear: both; font-size: medium; font-weight: 400; text-align: justify;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"></span></div></h3><h3><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span style="font-weight: 400;">2. </span>02.因數分解<span style="font-weight: 400;">:根據數學定義,若正整數 b 可以被正整數 a 整除(餘數為零),則 a 是 b 的因數。因此,我們很容易用暴力法(brute force)來思考:給一整數 n,從 1, 2, ..., n 全部掃一遍,如果能將 n 整除者即為 n 的因數。</span></span></span></div><div class="separator" style="clear: both;"><span style="color: #222222; font-size: medium; font-weight: 400; text-align: right;"><span><span><span style="color: black;">將 </span></span></span></span><span style="color: black; font-size: medium; font-weight: 400; text-align: left;">Python 程式</span><span style="color: black; font-size: medium; font-weight: 400; text-align: left;">轉換妥後</span><span style="color: black; font-size: medium; font-weight: 400;">以「</span><span style="color: black; font-size: medium; font-weight: 400; text-align: center;"><span style="white-space: pre-wrap;">02.因數分解.py」存檔執行</span></span><span style="color: black; font-size: medium; font-weight: 400;">後就能看到</span><span style="color: black; font-size: medium; font-weight: 400; text-align: left;">如圖 2</span><span style="color: black; font-size: medium; font-weight: 400; text-align: left;"> 所對應的</span><span style="color: black; font-size: medium; font-weight: 400;">執行結果。</span></div></h3><h3><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span style="font-weight: 400;"></span></span></span></div><div class="separator" style="clear: both; font-size: medium; font-weight: 400; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFQyoAky8Lb8cyxL_TSx1V-v7RRSw9EpW4qJQHY_qM5YzFjihKGqWpJCaH1hbF0hxuz7VkYZaSadLv-Emu6ns92QhtH91UR8qFNdpTuY_uWWD0S7rnW574SsS96ANs14yz6fsfvRgAgv-jkECbyebZwaO1cy3kWNO1O0uXlbpqQRv2Us6wJjTiFg/s1668/Snap2.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="891" data-original-width="1668" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFQyoAky8Lb8cyxL_TSx1V-v7RRSw9EpW4qJQHY_qM5YzFjihKGqWpJCaH1hbF0hxuz7VkYZaSadLv-Emu6ns92QhtH91UR8qFNdpTuY_uWWD0S7rnW574SsS96ANs14yz6fsfvRgAgv-jkECbyebZwaO1cy3kWNO1O0uXlbpqQRv2Us6wJjTiFg/s16000/Snap2.png" /></a></div></span></div><div class="separator" style="clear: both; font-weight: 400; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="color: black; font-size: x-small;">圖 2:求正整數 n 的所有因數</span></span></div><div class="separator" style="clear: both; font-size: medium; font-weight: 400; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="color: black; font-size: small;"><br /></span></span></div></h3><h3><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span style="font-weight: 400;">3.<span> </span></span>03.質數判斷<span style="font-weight: 400;">:根據數學定義,質數為 1 及 本身為其因數的正整數。因此,我們很容易用暴力法來思考:給一整數 n,從 1, 2, ..., n 全部掃一遍,如果 2~(n - 1) 中沒有任何一數可以整除 n 者,n 即為質數。</span></span></span></div><div class="separator" style="clear: both;"><span style="color: #222222; font-size: medium; font-weight: 400; text-align: right;"><span><span><span style="color: black;">將 </span></span></span></span><span style="color: black; font-size: medium; font-weight: 400; text-align: left;">Python 程式</span><span style="color: black; font-size: medium; font-weight: 400; text-align: left;">轉換妥後</span><span style="color: black; font-size: medium; font-weight: 400;">以「</span><span style="color: black; font-size: medium; font-weight: 400; text-align: center;"><span style="white-space: pre-wrap;">03.質數判斷.py」存檔執行</span></span><span style="color: black; font-size: medium; font-weight: 400;">後就能看到</span><span style="color: black; font-size: medium; font-weight: 400; text-align: left;">如圖 3</span><span style="color: black; font-size: medium; font-weight: 400; text-align: left;"> 所對應的</span><span style="color: black; font-size: medium; font-weight: 400;">執行結果。</span></div></h3><h3><div class="separator" style="clear: both; font-size: medium; font-weight: 400; text-align: justify;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="color: black; font-size: small;"><div></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="text-align: justify;"><span></span></div></div></div></span></span></div></h3><h3><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span style="font-weight: 400;"></span></span></span></div><div class="separator" style="clear: both; font-size: medium; font-weight: 400; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIpStBmI_Oj4kKvyOvinVtq9l8Bv2aA-y8pkKSbyXDgcl7EQ2euwAV2gCBscvk2qB_xZQPRAWSzZwisx0cRY2a-G_Iuu4X7pkHD6aI6HyYw-pp65B7fCk_8mlEMbUaGsYhHA2-jutPwkC1DFyd-4qq9WLhBf053dBZXxGg8I5_a1py2TZ2789tqA/s1676/Snap4.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="802" data-original-width="1676" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIpStBmI_Oj4kKvyOvinVtq9l8Bv2aA-y8pkKSbyXDgcl7EQ2euwAV2gCBscvk2qB_xZQPRAWSzZwisx0cRY2a-G_Iuu4X7pkHD6aI6HyYw-pp65B7fCk_8mlEMbUaGsYhHA2-jutPwkC1DFyd-4qq9WLhBf053dBZXxGg8I5_a1py2TZ2789tqA/s16000/Snap4.png" /></a></div><div class="separator" style="clear: both; text-align: center;"><span style="color: black; font-size: small;">圖 3:判斷 n 是否為質數</span></div><div class="separator" style="clear: both; text-align: center;"><span style="color: black; font-size: small;"><br /></span></div></span></div></h3><h3><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span style="font-weight: 400;">4. </span>04.開根號<span style="font-weight: 400;">:本問題需採用</span><span>數值方法(numeric method)</span><span style="font-weight: 400;">去逼近答案,有興趣研究其演算方法的讀者請自行參考 <a href="https://reurl.cc/M0YgGk">https://reurl.cc/M0YgGk</a>。</span></span></span></div><div class="separator" style="clear: both;"><span style="color: #222222; font-size: medium; font-weight: 400; text-align: right;"><span><span><span style="color: black;">將 </span></span></span></span><span style="color: black; font-size: medium; font-weight: 400; text-align: left;">Python 程式</span><span style="color: black; font-size: medium; font-weight: 400; text-align: left;">轉換妥後</span><span style="color: black; font-size: medium; font-weight: 400;">以「</span><span style="color: black; font-size: medium; font-weight: 400; text-align: center;"><span style="white-space: pre-wrap;">04.開根號.py」存檔執行</span></span><span style="color: black; font-size: medium; font-weight: 400;">後就能看到</span><span style="color: black; font-size: medium; font-weight: 400; text-align: left;">如圖 4</span><span style="color: black; font-size: medium; font-weight: 400; text-align: left;"> 所對應的</span><span style="color: black; font-size: medium; font-weight: 400;">執行結果。</span></div></h3><h3><div class="separator" style="clear: both; font-size: medium; font-weight: 400;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="color: black; font-size: small;"><div></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="text-align: justify;"><span></span></div></div></div></span></span></div></h3><h3><div class="separator" style="clear: both; font-size: medium; font-weight: 400; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><div class="separator" style="clear: both; text-align: justify;"></div></span></div></h3><h3><div class="separator" style="clear: both;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><span style="font-size: small;"><span style="font-weight: 400;"></span></span></span></div><div class="separator" style="clear: both; font-size: medium; font-weight: 400; text-align: center;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222;"><div class="separator" style="clear: both;"><br /></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj453yLB06_frmVBkPvd3zjqHDUVHwYvBJVyqz0ED7lh8yhC0Yldqnmem9p2WkGTU02V5el1UJTRgkVGtSOIAQP7pZR1yttoHKGoqvW1x-bnyvxu8bWnDE7qP_qXY0BgbNlCEd-w0tAmEfCbRdI1w3CHxZ0ZnZpDGpC-gCBzwFwDydR7neJjxqpRg/s1762/Snap11.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="943" data-original-width="1762" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj453yLB06_frmVBkPvd3zjqHDUVHwYvBJVyqz0ED7lh8yhC0Yldqnmem9p2WkGTU02V5el1UJTRgkVGtSOIAQP7pZR1yttoHKGoqvW1x-bnyvxu8bWnDE7qP_qXY0BgbNlCEd-w0tAmEfCbRdI1w3CHxZ0ZnZpDGpC-gCBzwFwDydR7neJjxqpRg/s16000/Snap11.png" /></a></div><div class="separator" style="clear: both;"><span style="color: black; font-size: small;">圖 4:以數值方法計算平方根</span></div></span></div></h3></div><div class="separator" style="clear: both; text-align: center;"><div class="separator" style="clear: both;"><div class="separator" style="text-align: justify;"><div><span><!--more--></span></div></div></div></div></div></div></span></div></div><div><div style="background-color: white;"><ol><li style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; margin: 0px 0px 0.25em; padding: 0px; text-align: justify;"><span style="font-size: x-small;"><a href="http://creativecommons.tw/explore" style="background-color: transparent; color: #2288bb; font-family: times, "times new roman", serif; text-decoration-line: none;" target="_blank">六種授權條款</a><span face="arial, tahoma, helvetica, freesans, sans-serif" style="background-color: transparent;">。</span></span></li></ol></div></div>Ted Leehttp://www.blogger.com/profile/03077454870590095355noreply@blogger.com0tag:blogger.com,1999:blog-1468347421357730785.post-9162315959183260052022-07-18T13:39:00.052+08:002022-07-23T16:30:32.831+08:00[micro:bit, 小彼特, BLE, 藍牙] 你的小彼特(micro:bit)藍牙好配嗎?<h1 style="text-align: center;"> <span style="text-align: center;">你的小彼特(micro:bit)藍牙好配嗎?</span></h1><div style="background-color: white; text-align: center;"><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><a href="https://www.facebook.com/groups/134149180510967/" style="color: #2288bb; text-decoration-line: none;" target="_blank"><span style="font-family: times, "times new roman", serif;">Ted Lee的土饅頭(To Mentor)工坊</span></a></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><div><span style="font-family: times, "times new roman", serif;">Line:ted2016.kpvs</span><br /><span style="font-family: times, "times new roman", serif;">Email:Lct4246@gmail.com</span><br /><span style="font-family: times, "times new roman", serif;"><span style="font-family: "times new roman", serif;">FB</span>:<span style="font-family: "times new roman", serif;">http://gg.gg/</span><span style="color: #00cc00; font-family: "times new roman", serif;">TedLee</span><span style="color: red; font-family: "times new roman", serif;">FB</span><span style="font-family: "times new roman", serif;">/</span></span></div><div><span lang="" style="font-family: times, "times new roman", serif; font-size: 12pt;">Blog<span style="font-family: "times new roman"; font-size: small;">:</span>http://gg.gg/<span style="color: #00cc00;">TedLee</span><span style="color: red;">Blog</span>/</span><br /></div></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><span style="font-family: times, "times new roman", serif;"><br /></span></div><div style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px;"><span style="font-family: times, "times new roman", serif;">July 18, 2022</span></div><div><span><span style="color: #222222; font-family: times, "times new roman", serif;"><span style="font-size: 13.2px;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2F7FcmJlzT_8c5MIatt6RjBVCkpHOKNiSog2XrSyRAFUyvBO0BlpPbXKfZODUtcxsXe01w14O4zcyYrFLJj7kNYMMd8GI6gmVUHW411eTaFuMX_-kq8McdXzssd-4pP8wp5LiTH1GJ2iNYKTToW88010Ky2_1bpR7_DiX924EaoSbctoJwhLEAQ/s88/CC.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="31" data-original-width="88" height="31" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2F7FcmJlzT_8c5MIatt6RjBVCkpHOKNiSog2XrSyRAFUyvBO0BlpPbXKfZODUtcxsXe01w14O4zcyYrFLJj7kNYMMd8GI6gmVUHW411eTaFuMX_-kq8McdXzssd-4pP8wp5LiTH1GJ2iNYKTToW88010Ky2_1bpR7_DiX924EaoSbctoJwhLEAQ/s1600/CC.png" width="88" /></a>[1]</div></span></span><div class="separator" style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13.2px; text-align: left;"><br /></div><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify;"><span style="color: #222222;">小彼特的藍牙配對</span> [2] 一直是小彼特粉絲們心中的痛,眼看著明明有板載的無線通訊功能可用,但就是看的到連不到,著實氣人<span style="color: #222222;">。本文在放棄數年後,因一個新訊息而重燃起一絲絲希望。</span></div><div class="separator" style="clear: both; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: justify;"><span style="color: #222222;">終於,經過日以繼夜的努力,在 V2 的主板上以 100% 的成功率實測出一套建立藍牙連線的 SOP 供讀者們做後續應用。</span></div><div class="separator" style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;"><div class="separator" style="clear: both; text-align: center; white-space: pre-wrap;"><span><a name='more'></a></span></div></div><h2 style="clear: both; color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; text-align: left;">問題說明</h2><div class="separator" style="clear: both; text-align: left;"><div class="separator" style="clear: both;"><span style="text-align: justify;"><div class="separator" style="clear: both; text-align: left;"><div class="separator" style="clear: both;"><div style="text-align: justify;"><div class="separator" style="clear: both; text-align: justify;"><span style="color: #222222;">2020 年 10 月小彼特的主板由 V1 <b>升級(upgrade)</b>到 V2。其中,</span>V1 的藍牙是 4.0(內建於 Nordic nRF51822 CPU 中),V2 的藍牙是 5.0(內建於 Nordic nRF52833 CPU 中)。我們在官方宣佈全球發行前已先取得了樣品做測試。當然,也在既期待又怕受傷害的心情之下,測了它的藍牙通訊功能。結果,還是以失望收場。<br />2022 年 6 月 22 日,虎科大陳國益教授公佈了他使用 V7RC app(<a href="https://reurl.cc/o1OxDq">https://reurl.cc/o1OxDq</a>)已能成功地以小彼特來控制泡棉<span face=""Segoe UI Historic", "Segoe UI", Helvetica, Arial, sans-serif" style="color: #050505; font-size: 15px; text-align: start; white-space: pre-wrap;">遙控飛機</span>(<a href="https://reurl.cc/Wrp35D">https://reurl.cc/Wrp35D</a>)──這又再度燃起我們的「妄想」:</div><div class="separator" style="clear: both; text-align: justify;"><br /></div><div class="separator" style="clear: both; text-align: justify;"><blockquote>Samsung 最早發行在小彼特上以藍牙傳送 MakeCode 程式的 app(<a href="https://reurl.cc/DyWZXQ">https://reurl.cc/DyWZXQ</a>)是否有機會和筆者的 Android 手機更容易速配呢?</blockquote><p><br /></p><p>註:筆者只關心在 Android 載具上經由藍牙傳送程式到小彼特的操作原因是早在 V1 版時和 Apple 載具的速配率已高達 95% ,但在 Andoid 上不速配災情時有所聞!</p></div></div></div></div></span></div><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; text-align: justify;"><div class="separator" style="clear: both; font-weight: bold; text-align: left;"><span><!--more--></span></div><div class="separator" style="clear: both; font-weight: bold; text-align: left;"><h2 style="clear: both;"></h2></div></span></div><div class="separator" style="clear: both; text-align: left;"><h2 style="clear: both; text-align: justify;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; text-align: left;">實測方法</span></h2></div><div class="separator" style="clear: both; text-align: left;"><div class="separator" style="clear: both;"><div style="text-align: justify;"><h3><div class="separator" style="clear: both; font-size: medium;"><span style="font-weight: 400;">一般而言,使用藍牙裝置的操作有兩個階段:</span>配對(pairing)<span style="font-weight: 400;">和建立</span>連線(connection)<span style="font-weight: 400;">。根據筆者在 V1 和 V2 主板上的實測,第一階段通常都沒問題。然而,媒人說完媒後正準備娶親時,新娘竟逃婚了…。而這落跑新娘的戲碼,卻不斷的在重複上演。</span></div><div class="separator" style="clear: both; font-size: medium;"><span style="font-weight: 400;">還好,目前我們抽樣測試後,已宣告在 V2 主板上可以順利完成任務的流程(V1 主板仍測試失敗) [3],完整的說明文件請參考 </span><a href="https://reurl.cc/3odoKO" style="font-weight: 400;">https://reurl.cc/3odoKO</a><span style="font-weight: 400;">。註:<span style="color: red;">為避免已記住的藍牙配對裝置無端被優先配對,最好都預先清除之。</span></span></div></h3><h3 style="clear: both; font-size: medium;">配對階段</h3><div class="separator" style="clear: both; font-size: medium;"><ol><li>主板端:將 V2 主板供電,同時按下 A、B 按鈕後,再按主板背面的重置(reset)按鈕一下,讓小彼特進入<b>藍牙配對模式(Bluetootn mode)</b>。待板載的 25 顆 LED 全亮完,出現<b>藍牙商標(bluetooth logo)</b><a href="https://blogger.googleusercontent.com/img/a/AVvXsEjaZ0l_942bOvIWq31ERqorML4ULtbG1al_kbdusqeaWqtCa2TM9hNRmyAW7iU5dthZKPXEu0VhTzk8ah_33vZg9uVrya22oJ__R0C7cqmrlLiArS2TlFqxQQczGUgnddBJFX8S0vzeUM6f96-jv5LSi6Mi3h_Z17BMBFFfY7saYC8hYMLeyW59JA" style="margin-left: 1em; margin-right: 1em; text-align: center;"><img alt="" data-original-height="768" data-original-width="768" height="69" src="https://blogger.googleusercontent.com/img/a/AVvXsEjaZ0l_942bOvIWq31ERqorML4ULtbG1al_kbdusqeaWqtCa2TM9hNRmyAW7iU5dthZKPXEu0VhTzk8ah_33vZg9uVrya22oJ__R0C7cqmrlLiArS2TlFqxQQczGUgnddBJFX8S0vzeUM6f96-jv5LSi6Mi3h_Z17BMBFFfY7saYC8hYMLeyW59JA=w69-h69" width="69" /></a>(<a href="https://reurl.cc/x9z9E1">https://reurl.cc/x9z9E1</a>)後,接著會出現<b>配對樣式(paring pattern)</b>。</li><li>Android 載具端:下載 Samsung 開發,現已移交給教育基金會維護的這隻 app(<a href="https://reurl.cc/KbVbo9">https://reurl.cc/KbVbo9</a>),裝妥後按配對(Pair)功能。再將 1 的樣式填入後即可看到配對成功的勾勾。</li><li>重置主板。<br /></li></ol></div><h3 style="clear: both; font-size: medium;">連線傳(flash) MakeCode 程式階段</h3><div class="separator" style="clear: both; font-size: medium;"><ol><li>主板端:如前述,再讓主板進入藍牙配對模式等候。</li><li>Android 載具端:接建立程式(Create Code)功能,app 會自動連入 MakeCode。撰寫一個大、小愛心輪流閃爍的程式後接左下角的<b>下載(download)</b>按鈕。靜待若干畫面後即可看到上個步驟寫好的心跳程式已順利載入主板中執行。</li></ol></div><span><!--more--></span><h2 style="clear: both;"><span style="color: #222222;"><span style="font-size: large;">問題討論</span></span></h2><div class="separator" style="clear: both; font-size: medium;"><ol><li>為什麼 Apple 的 iPad 和 iPhone 會比 Android 的<b>裝置(devices)</b>更容易使用藍牙和小彼特通訊呢?</li><li style="font-weight: 400;">為什麼本文的方法在 V1 的主板上不能成功傳輸 MakeCode 程式呢?這個問題的可能情況請參考這位麥客友(<a href="https://reurl.cc/VDyEX6">https://reurl.cc/VDyEX6</a>)的研究推論及他歸納出的一套配對流程。</li><li style="font-weight: 400;">關於在 Android 手機(現今應該沒人在用 Andoird 平板了吧?)上用 App Inventor 撰寫 app,並以藍牙遙控 Arduino(利用 HC-05 之類的藍牙模組)外接的 LED,可參考這篇(<a href="https://reurl.cc/0pYZWb">https://reurl.cc/0pYZWb</a>)。手機和 Arduino 之間的藍牙控制是為傳 a 開燈,傳 b 關燈。讀者們可以仿照 Arduino 的例子,改換成小彼特控制試試。</li><li style="font-weight: 400;">關於像 V7RC app 可以很順利和小彼特配對妥並控制其上所外接的馬達之 app,因為陳教授已在 V1 和 V2 實測出百分之百的成功率,故讀者們可以自行再試試看。</li><li style="font-weight: 400;">以行動載具做小彼特教學?就算是平板有較大螢幕,拉拉小程式的積木來體驗一下可能還好。一但程式較大,畫面捲來捲去的,應該不是一個好的開發工具吧?</li></ol></div><div class="separator" style="clear: both;"><span style="color: #222222; font-size: small;"><span><!--more--></span></span></div></div></div></div></span></div></div><div><div style="background-color: white;"><ol><li style="color: #222222; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; margin: 0px 0px 0.25em; padding: 0px; text-align: justify;"><span style="font-size: x-small;"><a href="http://creativecommons.tw/explore" style="background-color: transparent; color: #2288bb; font-family: times, "times new roman", serif; text-decoration-line: none;" target="_blank">六種授權條款</a><span face="arial, tahoma, helvetica, freesans, sans-serif" style="background-color: transparent;">。</span></span></li><li style="margin: 0px 0px 0.25em; padding: 0px; text-align: justify;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; font-size: x-small;">藍牙 vs. 藍芽?(</span><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; font-size: x-small;"><a href="https://reurl.cc/q5MOgy">https://reurl.cc/q5MOgy</a>)。</span></li><li style="margin: 0px 0px 0.25em; padding: 0px; text-align: justify;"><span face="Arial, Tahoma, Helvetica, FreeSans, sans-serif" style="color: #222222; font-size: x-small;">此測試流程可參考 2017 年拍攝的這段完整影片:<a href="https://reurl.cc/0pY2Mb">https://reurl.cc/0pY2Mb</a>。</span></li></ol></div></div>Ted Leehttp://www.blogger.com/profile/03077454870590095355noreply@blogger.com0