กำหนดเองส่วนติดต่อผู้ใช้ส่วนประกอบไม่ได้กำลังปรับปรุงใน LazyVGrid

0

คำถาม

ฉันต้องสร้างกำหนดเองธาตุฉันโทรมา Slide. ฉันมี LazyVGrid นั่นแสดงของฉัน Slide ส่วนประกอบ. ปัญหาของฉันคือเมื่อผมปรับปรุงข้อมูลตารางคู่ลำดับของเส้นกริดใช้ที่ Slide ส่วนประกอบไม่ได้กำลังปรับปรุง.

สถานการณ์: ของผู้ใช้ลิกที่ตัวเลือกปุ่มบน Slide และเปลี่ยนแปลง Slide สี,ฉันก็กำลังปรับปรุงข้อมูลตารางคู่ลำดับแต่ง Slide อีลีเมนต์ไม่ปรับปรุงโดยไม่คำนึงถึงข้อมูลที่ถูกต้อง(ฉันต้องพิสูจน์เรื่องนี้โดยการเพิ่ม Text(slide.color) เข้า LazyVGrid ซึ่งแสดงรายใหม่ที่ถูกตั้งค่าสีของคาดหวัง)

ผมสงสัย: ฉันคิดว่ามันไม่ปรับปรุงเพราะว่าฉันมีบางอย่างผิดที่ Slide struct ฉันค่อนข้างใหม่ที่จะต้อง SwiftUI ดังนั้นฉันเรียนรู้ที่สุดที่ข้าจะไปได้ขอบใจ ฉันต้องยังพูดถึงว่าความสนและแสดงอย่างถูกต้องเมื่อครั้งแรกที่ฉันแสดงมุมมองเดียวที่ปัญหาคือมันไม่ปรับปรุงเมื่อฉันปรับปรุง SlideStructure.

นี่คือรหัส:

struct ShowSongFile : View {
@EnvironmentObject var SlideStructure : SlidesModel
@State var selectedSlide : SplaySlide? = nil
var columns = [GridItem(.adaptive(minimum: 320))]
var body: some View {
    ScrollView {
        LazyVGrid(columns: columns, alignment: .trailing, spacing: 20) {
            ForEach(SlideStructure.SongSlides, id:\.id) { slide in
                if slide.id == selectedSlide?.id {
                    Slide(IsSelected:true, SlideData: slide)
                 
                } else {
                    Slide(IsSelected:false, SlideData: slide)
                        .onTapGesture {
                            selectSlide(Slide: slide)
                        }
                }
            }
        }.onAppear(perform: loadSelectedFile)
    }
}

นี่คือภาพนิ่งแฟ้มซึ่งนั่นก็แสดงให้เห็นว่าฉันเป็นการตั้งค่าสีสำหรับสไลด์เลือด:

struct Slide : View {
@State var EnableSlideEditing : Bool? = false
@State var IsSelected : Bool = false
@State var SlideData : SplaySlide
@EnvironmentObject var SlideStructure : SlidesModel

var body : some View {
    VStack {
        Group{
            VStack(alignment: .center) {
                let editor = TextEditor(text: $SlideData.lyric)
                    .multilineTextAlignment(.center)
                    .padding()
                let text = Text(SlideData.lyric)
                    .multilineTextAlignment(.center)
                    .frame(width: 320.0, height: 160.0)
                if EnableSlideEditing ?? false {
                    editor
                } else {
                    text
                }
                
                Group {
                    HStack {
                        Text(SlideData.slideType)
                            .padding(.leading, 5.0)
                        Spacer()
                        MenuButton(label: Image(systemName: "ellipsis.circle")) {
                            Button("Edit Slide Text", action: {EnableSlideEditing?.toggle()})
                            Divider()
                            Menu("Slide Type") {
                                Button("Verse", action: {SlideType(Type: "Verse", ColorHex: "#f57242")})
                                Button("Chorus", action: {SlideType(Type: "Chorus", ColorHex: "#0068bd")})
                                Button("Pre-Chorus", action: {SlideType(Type: "Pre-Chorus", ColorHex: "#02ad96")})
                                Button("Tag", action: {SlideType(Type: "Tag", ColorHex: "#ad027d")})
                                Button("Bridge", action: {SlideType(Type: "Bridge", ColorHex: "#02ad96")})
                            }
                            Menu("Transitions") {
                                Button("Option 1", action: {})
                                Button("Option 2", action: {})
                            }
                            Divider()
                            Button("Delete Slide", action: {})
                            Button("Duplicate Slide", action: {})
                        }
                        .menuButtonStyle(BorderlessButtonMenuButtonStyle())
                        .frame(alignment: .trailing)
                        .padding(.trailing, 5.0)
                        .buttonStyle(PlainButtonStyle())
                    }
                }
                .frame(width: 320, height: 20, alignment: .leading)
                .background(Color.init(hex: SlideData.slideBorderColorHex))
            }
        }
        .frame(width: 320, height: 180, alignment: .bottomLeading)
        .background(IsSelected ? Color.accentColor : .black)
        .cornerRadius(10)
    }
}

func SlideType(Type:String, ColorHex: String) {
    for (index, slide) in SlideStructure.SongSlides.enumerated() {
        if slide.id == self.SlideData.id {
            SlideStructure.SongSlides[index].slideBorderColorHex = ColorHex
            SlideStructure.SongSlides[index].slideType = Type
            ShowSongFile.main?.SongFile.slides = SlideStructure.SongSlides
            ShowSongFile.main!.SongFile.SaveSongToDisk()
          }
      }
   }
}

SlideStructure:(SlideModel)

class SlidesModel : ObservableObject {
@Published var SongSlides : [SplaySlide] = []
}
swiftui
2021-11-23 03:59:03
1

คำตอบที่ดีที่สุด

0

มันมีมากเกินไปหายตัวไปส่วนที่เป็นสามารถจะทดสอบอะไรพิเศษทางออกดังนั้นฉันจะทายเอง ใน ShowSongFile คุณสามารถลอง:

LazyVGrid(columns: columns, alignment: .trailing, spacing: 20) {
    ForEach(SlideStructure.SongSlides, id:\.id) { slide in
        Slide(SlideData: slide)  // <--- here
            .onTapGesture {
                selectSlide(Slide: slide)
            }
            .background(slide.id == selectedSlide?.id ? Color.accentColor : .black)  // <--- here
    }
            
            

และปรับตัว Slide ได้ตามคาดว่าเป็นลบ IsSelected แล้ว .background(IsSelected ? Color.accentColor : .black).

พีเอส:ของคุณตั้งชื่อและคดีของตัวแปรและฟังก์ชันที่ทำให้ อ่านรหัสของคุณน้อยกว่าดึงดูด.

2021-11-23 04:33:26

ในภาษาอื่นๆ

หน้านี้อยู่ในภาษาอื่นๆ

Русский
..................................................................................................................
Italiano
..................................................................................................................
Polski
..................................................................................................................
Română
..................................................................................................................
한국어
..................................................................................................................
हिन्दी
..................................................................................................................
Français
..................................................................................................................
Türk
..................................................................................................................
Česk
..................................................................................................................
Português
..................................................................................................................
中文
..................................................................................................................
Español
..................................................................................................................
Slovenský
..................................................................................................................