{"id":36022,"date":"2022-05-31T15:17:30","date_gmt":"2022-05-31T19:17:30","guid":{"rendered":"https:\/\/mjtsai.com\/blog\/?p=36022"},"modified":"2022-05-31T15:17:30","modified_gmt":"2022-05-31T19:17:30","slug":"swiftui-equal-and-ideal-sizes","status":"publish","type":"post","link":"https:\/\/mjtsai.com\/blog\/2022\/05\/31\/swiftui-equal-and-ideal-sizes\/","title":{"rendered":"SwiftUI Equal and Ideal Sizes"},"content":{"rendered":"<p><a href=\"https:\/\/sudrocket.de\/blog\/2022\/05\/swiftui-equal-and-ideal-sizes\/\">Matthias Maurberger<\/a> (via <a href=\"http:\/\/weekly.swiftwithmajid.com\/issues\/swiftui-weekly-issue-105-1192557\">SwiftUI Weekly<\/a>):<\/p>\n<blockquote cite=\"https:\/\/sudrocket.de\/blog\/2022\/05\/swiftui-equal-and-ideal-sizes\/\"><p>One example that illustrates this quite well is when you want to make all children of a <code>VStack<\/code> as wide as the widest child. Sounds like it should be straightforward. But it&rsquo;s not. It&rsquo;s a <em><a href=\"https:\/\/swiftbysundell.com\/questions\/syncing-the-width-or-height-of-two-swiftui-views\/\">surprisingly hard problem.<\/a><\/em><\/p><p>[&#8230;]<\/p><p>First, we&rsquo;ll wrap each Button&rsquo;s <code>Text<\/code> label in a <code>.frame<\/code> modifier with <code>maxWidth: .infnity<\/code>. That alone only solves our problem if we want our stack of buttons to occupy the full width it was given. If we want the stack of buttons to be as wide as it needs to be, we&rsquo;ll need to make a second adjustment: apply the <code>fixedSize<\/code> modifier to the <code>VStack<\/code>.<\/p><\/blockquote>\n\n<p>Previously:<\/p>\n<ul>\n<li><a href=\"https:\/\/mjtsai.com\/blog\/2020\/08\/06\/emulating-equal-size-constraints-in-swiftui\/\">Emulating Equal-Size Constraints in SwiftUI<\/a><\/li>\n<\/ul>","protected":false},"excerpt":{"rendered":"<p>Matthias Maurberger (via SwiftUI Weekly): One example that illustrates this quite well is when you want to make all children of a VStack as wide as the widest child. Sounds like it should be straightforward. But it&rsquo;s not. It&rsquo;s a surprisingly hard problem.[&#8230;]First, we&rsquo;ll wrap each Button&rsquo;s Text label in a .frame modifier with maxWidth: [&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-05-31T19:17:35Z","apple_news_api_id":"b9d541c0-d963-45b1-93a8-a98baebf8df6","apple_news_api_modified_at":"2022-05-31T19:17:35Z","apple_news_api_revision":"AAAAAAAAAAD\/\/\/\/\/\/\/\/\/\/w==","apple_news_api_share_url":"https:\/\/apple.news\/AudVBwNljRbGTqKmLrr-N9g","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,2078,30,2077,71,901,1812],"class_list":["post-36022","post","type-post","status-publish","format-standard","hentry","category-programming-category","tag-ios","tag-ios-15","tag-mac","tag-macos-12","tag-programming","tag-swift-programming-language","tag-swiftui"],"apple_news_notices":[],"_links":{"self":[{"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/posts\/36022","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=36022"}],"version-history":[{"count":1,"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/posts\/36022\/revisions"}],"predecessor-version":[{"id":36023,"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/posts\/36022\/revisions\/36023"}],"wp:attachment":[{"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/media?parent=36022"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/categories?post=36022"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/tags?post=36022"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}