{"id":1808,"date":"2024-12-03T01:07:53","date_gmt":"2024-12-02T16:07:53","guid":{"rendered":"https:\/\/www.typea.info\/blog\/?p=1808"},"modified":"2024-12-03T01:07:53","modified_gmt":"2024-12-02T16:07:53","slug":"swiftui_draw_guitar_flet","status":"publish","type":"post","link":"https:\/\/www.typea.info\/blog\/index.php\/2024\/12\/03\/swiftui_draw_guitar_flet\/","title":{"rendered":"SwiftUI\u3067\u30ae\u30bf\u30fc\u30d5\u30ec\u30c3\u30c8\u3092\u63cf\u753b"},"content":{"rendered":"<p>Swift UI \u3067 \u30ae\u30bf\u30fc\u30d5\u30ec\u30c3\u30c8\u3092\u63cf\u753b<\/p>\n<p>\u30ae\u30bf\u30fc\u306e\u30a2\u30d7\u30ea\u3092\u4f5c\u308a\u305f\u3044\u3002<\/p>\n<p>\u3068\u308a\u3042\u3048\u305a\u30d5\u30ec\u30c3\u30c8\u63cf\u753b\u3057\u3066\u307f\u308b\u3002<\/p>\n<pre class=\"prettyprint\">import SwiftUI\n\nstruct ContentView: View {\n    var body: some View {\n        VStack {\n            Canvas { context, size in\n                let topMargin = 50.0\n                let leftMargin = 20.0\n                let rowheight = (size.height - 160) \/ 5\n                let fletwidth = (size.width - 100) \/ 12\n                                for col in 0...12 {\n                    for row in 0...5 {\n                        let xpos = leftMargin + (fletwidth * CGFloat(col))\n                        let ypos = topMargin + (rowheight * CGFloat(row))\n\n                        if col == 0 {\n                            context.draw(\n                                Text(\"\\(row+1)\").font(.title2), at: CGPoint(x:xpos + fletwidth\/2, y:ypos))\n                        } else {\n                            if row == 5 {\n                                context.draw(\n                                    Text(\"\\(col)\").font(.title2), at: CGPoint(x:xpos + fletwidth\/2, y:ypos + 25))\n                                                            } else {\n                                context.stroke(\n                                    Path(CGRect(x: xpos,\n                                                y: ypos,\n                                                width: fletwidth,\n                                                height: rowheight )),\n                                    with: .color(.blue)\n                                )\n                            }\n                        }\n                    }\n                }\n            }\n            .border(Color(cgColor: .init(red: 0, green: 0, blue: 0, alpha: 1)))\n        }\n        .frame(width: 800, height: 360)\n        .border(Color(cgColor: .init(red: 1, green: 0, blue: 0, alpha: 1)))\n    }\n}\n<\/pre>\n<p>\u00a0<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" title=\"swiftui_guitar_flet.png\" src=\"https:\/\/www.typea.info\/blog\/wp-content\/uploads\/2024\/12\/swiftui_guitar_flet.png\" alt=\"Swiftui guitar flet.\" width=\"1905\" height=\"873\" border=\"0\" \/><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Swift UI \u3067 \u30ae\u30bf\u30fc\u30d5\u30ec\u30c3\u30c8\u3092\u63cf\u753b \u30ae\u30bf\u30fc\u306e\u30a2\u30d7\u30ea\u3092\u4f5c\u308a\u305f\u3044\u3002 \u3068\u308a\u3042\u3048\u305a\u30d5\u30ec\u30c3\u30c8\u63cf\u753b\u3057\u3066\u307f\u308b\u3002 import SwiftUI struct ContentView: View { var body: some  [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":1807,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"sns_share_botton_hide":"","vkExUnit_sns_title":"","_vk_print_noindex":"","sitemap_hide":"","_veu_custom_css":"","veu_display_promotion_alert":"","vkexunit_cta_each_option":"","footnotes":""},"categories":[],"tags":[134],"class_list":["post-1808","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","tag-swiftui"],"veu_head_title_object":{"title":"","add_site_title":""},"_links":{"self":[{"href":"https:\/\/www.typea.info\/blog\/index.php\/wp-json\/wp\/v2\/posts\/1808","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.typea.info\/blog\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.typea.info\/blog\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.typea.info\/blog\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.typea.info\/blog\/index.php\/wp-json\/wp\/v2\/comments?post=1808"}],"version-history":[{"count":1,"href":"https:\/\/www.typea.info\/blog\/index.php\/wp-json\/wp\/v2\/posts\/1808\/revisions"}],"predecessor-version":[{"id":1809,"href":"https:\/\/www.typea.info\/blog\/index.php\/wp-json\/wp\/v2\/posts\/1808\/revisions\/1809"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.typea.info\/blog\/index.php\/wp-json\/wp\/v2\/media\/1807"}],"wp:attachment":[{"href":"https:\/\/www.typea.info\/blog\/index.php\/wp-json\/wp\/v2\/media?parent=1808"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.typea.info\/blog\/index.php\/wp-json\/wp\/v2\/categories?post=1808"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.typea.info\/blog\/index.php\/wp-json\/wp\/v2\/tags?post=1808"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}