{"id":37735,"date":"2022-11-25T16:09:40","date_gmt":"2022-11-25T21:09:40","guid":{"rendered":"https:\/\/mjtsai.com\/blog\/?p=37735"},"modified":"2022-11-25T16:09:40","modified_gmt":"2022-11-25T21:09:40","slug":"clipped-doesnt-affect-hit-testing","status":"publish","type":"post","link":"https:\/\/mjtsai.com\/blog\/2022\/11\/25\/clipped-doesnt-affect-hit-testing\/","title":{"rendered":"clipped() Doesn&rsquo;t Affect Hit Testing"},"content":{"rendered":"<p><a href=\"https:\/\/oleb.net\/2022\/clipped-hit-testing\/\">Ole Begemann<\/a>:<\/p>\n<blockquote cite=\"https:\/\/oleb.net\/2022\/clipped-hit-testing\/\">\n<p>The <a href=\"https:\/\/developer.apple.com\/documentation\/swiftui\/view\/clipped(antialiased:)\"><code>clipped()<\/code><\/a> modifier in SwiftUI clips a view to its bounds, hiding any out-of-bounds content.<\/p>\n<p>[&#8230;]<\/p>\n<p>When you run this code, you&rsquo;ll discover that the button isn&rsquo;t tappable at all. This is because the (unclipped) square, despite not being fully visible, obscures the button and &ldquo;steals&rdquo; all taps.<\/p>\n<p>[&#8230;]<\/p>\n<p>The <code>clipped()<\/code> modifier doesn&rsquo;t affect the clipped view&rsquo;s hit testing region. The same is true for <a href=\"https:\/\/developer.apple.com\/documentation\/swiftui\/view\/clipshape(_:style:)\"><code>clipShape(_:)<\/code><\/a>. It&rsquo;s often a good idea to combine these modifiers with <code>.contentShape(Rectangle())<\/code> to bring the hit testing logic in sync with the UI.<\/p>\n<\/blockquote>","protected":false},"excerpt":{"rendered":"<p>Ole Begemann: The clipped() modifier in SwiftUI clips a view to its bounds, hiding any out-of-bounds content. [&#8230;] When you run this code, you&rsquo;ll discover that the button isn&rsquo;t tappable at all. This is because the (unclipped) square, despite not being fully visible, obscures the button and &ldquo;steals&rdquo; all taps. [&#8230;] The clipped() modifier doesn&rsquo;t [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"apple_news_api_created_at":"2022-11-25T21:09:43Z","apple_news_api_id":"e927b896-2ef3-4019-b912-cc2358e2b4bd","apple_news_api_modified_at":"2022-11-25T21:09:43Z","apple_news_api_revision":"AAAAAAAAAAD\/\/\/\/\/\/\/\/\/\/w==","apple_news_api_share_url":"https:\/\/apple.news\/A6Se4li7zQBm5EswjWOK0vQ","apple_news_coverimage":0,"apple_news_coverimage_caption":"","apple_news_is_hidden":false,"apple_news_is_paid":false,"apple_news_is_preview":false,"apple_news_is_sponsored":false,"apple_news_maturity_rating":"","apple_news_metadata":"\"\"","apple_news_pullquote":"","apple_news_pullquote_position":"","apple_news_slug":"","apple_news_sections":"\"\"","apple_news_suppress_video_url":false,"apple_news_use_image_component":false,"footnotes":""},"categories":[4],"tags":[31,2185,30,2223,71,901,1812],"class_list":["post-37735","post","type-post","status-publish","format-standard","hentry","category-programming-category","tag-ios","tag-ios-16","tag-mac","tag-macos-13-ventura","tag-programming","tag-swift-programming-language","tag-swiftui"],"apple_news_notices":[],"_links":{"self":[{"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/posts\/37735","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/comments?post=37735"}],"version-history":[{"count":1,"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/posts\/37735\/revisions"}],"predecessor-version":[{"id":37736,"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/posts\/37735\/revisions\/37736"}],"wp:attachment":[{"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/media?parent=37735"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/categories?post=37735"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/tags?post=37735"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}