How do you make the Medium view look the way it's supposed to?

I know this is far after the fact, but in going through the Widgets Code-along, part 2: Alternate timelines code-along, and having done very little SwiftUI, I ran into an issue that I can't seem to figure out. Things like this are one of the biggest reasons I haven't even considered migrating any of my apps to SwiftUI - I just can't get the UI to look the way I want it to.

The code in question is very simple: Just a couple of things inside an HStack. For some reason, they added a ZStack around that (the HStack is the only thing inside it), and that ZStack changes the font size of one of the two HStack contents very slightly. For some reason. I'm really not sure why they bothered with the ZStack - it only has one thing inside it.

Anyway, the code looks like this:

          HStack(alignment: .top) {
            AvatarView(entry.character)
              .foregroundColor(.white)
            Text(entry.character.bio)
              .padding()
              .foregroundColor(.white)
          }
          .padding()
          .widgetURL(entry.character.url)
        }
        .background(Color.gameBackground)
        .widgetURL(entry.character.url)

And on the Panda hero (the only one Izzy demos), it looks fine. But The problem is with literally any other hero - they all have bios that are longer than Panda's, and they all clip their contents.

If I put a background or a border on the Text(), it's very clear that while the left side (the AvatarView) takes up the whole height of the widget, the Text does not. That makes sense if its contents are small, but in most cases, the contents are substantially larger, and they clip, while leaving a bunch of blank space underneath. Obviously, that's just simply unacceptable from a UI perspective, and I haven't been able to figure out which of the modifiers I can put on Text will correct this - if any.

I'm excited about the potential of SwiftUI to simplify what can often be huge storyboards, but things like this (******, little, should-be-easy things being effectively impossible) make me think that it's not worth the hassle.

I did do web searches, including looking on StackOverflow, but what do you even search on for things like this? The terms I searched on, at least, bore no fruit.

Thanks in advance for any help you can offer.

  • I put SwiftUI and wwdc20-10035 into the Tags section before hitting Submit, but they were not saved. Hopefully the Search feature searches replies as well.

Add a Comment

Replies

Also, the code block should begin with a ZStack {, but I can't edit my post.