ForEach and GeometryReader: variable height for children?

只谈情不闲聊 提交于 2020-06-17 08:05:49

问题


I have following example:

import SwiftUI

struct TestSO: View {

    @State var cards = [
        Card(title: "short title text", subtitle: "short title example"),
        Card(title: "medium title text text text text text", subtitle: "medium title example"),
        Card(title: "long title text text text text text text text text text text text text text text text text text",
         subtitle: "long title example"),
        Card(title: "medium title text text text text text", subtitle: "medium title example"),
        Card(title: "short title text", subtitle: "short title example"),
    ]

    @State var showDetails = false

    var body: some View {
        NavigationView {
            ScrollView {
                VStack {
                    ForEach(cards.indices) { index in
                        GeometryReader { reader in
                            CardView(showDetails: self.$showDetails, card: self.cards[index])
                                .offset(y: self.showDetails ? -reader.frame(in: .global).minY : 0)
                                .onTapGesture {
                                    self.showDetails.toggle()
                                    self.cards[index].showDetails.toggle()
                            }
                        }.frame(height: self.showDetails ? UIScreen.main.bounds.height : 80, alignment: .center)
                    }
                }
            }.navigationBarTitle("Content", displayMode: .large)
        }
    }
}

struct CardView : View {

    @Binding var showDetails : Bool

    var card : Card

    var body: some View {
        VStack(alignment: .leading){
            HStack{
                Text(card.subtitle).padding([.horizontal, .top]).fixedSize(horizontal: false, vertical: true)
                Spacer()
            }
            Text(card.title).fontWeight(Font.Weight.bold).padding([.horizontal, .bottom]).fixedSize(horizontal: false, vertical: true)
            if(card.showDetails && showDetails) {
                Spacer()
            }
        }
        .background(Color.white)
        .cornerRadius(16)
        .shadow(radius: 12)
        .padding()
        .opacity(showDetails && card.showDetails ? 1 : (!showDetails ? 1 : 0))
    }
}

struct Card : Identifiable{
    var id = UUID()
    var title : String
    var subtitle : String
    var showDetails : Bool = false
}

It's a list of cards which expand if the user taps on it. The problem here is the .frame(height: self.showDetails ? UIScreen.main.bounds.height : 80, alignment: .center) line. Depending on how much text a Card-Object has for its title or subtitle, the CardView has to be smaller or larger than 80. I need to calculate the height and use that instead of the fixed 80.

How it looks:

Any idea how I can use the GeometryReader with a variable height for the CardView children?

Thanks in advance!

来源:https://stackoverflow.com/questions/62358846/foreach-and-geometryreader-variable-height-for-children

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!