微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

SwiftUI卡视图-用于媒体播放器?

如何解决SwiftUI卡视图-用于媒体播放器?

所以我在考虑如何在主SwiftUI中创建上下拖动视图。基本上是我正在考虑做的事情-但如果我在正确的轨道上,则需要一些建议。

第1步)

  • MediaPlayer.Swift 像这样:在其中有卡片视图:
        @State private var tapped: Bool = false
 
            var body: some view {
     
                 Card(tapped: self.tapped)

                   .gestured(TapGesture(count: 1)

                       .onEnded({() in
 
                            self.tapped.toggle()
 
                   })
        )

        }

       }


我所看到的问题是,这不一定是正确的方法(上下滑动视图)?

然后我将该视图包含在主视图中-其中包含其他视图,例如电台和播客。

我唯一看到的问题如下:

  1. 将命令发送到媒体播放器视图以更改电台或播放播客,我需要它向上滑动媒体播放器视图然后运行命令。

对于代码,不同的布局使用类似以下内容

struct ContentView: View {
    @Environment(\.horizontalSizeClass) var horizontalSizeClass: UserInterfaceSizeClass?

    var body: some View {
        if horizontalSizeClass == .compact {
            return Text("Compact")
        } else {
            return Text("Regular")
        }
    }
}

更新:

所以看完https://developer.apple.com/videos/play/wwdc2019/808/之后(强烈推荐)。

我发现它叫张纸-谁知道大声笑。

所以我已经在代码中实现了它,但是当他们滑下来时如何保持工作表可见。 (例如仅说80px)

这是我添加代码。 (请注意,我已经包含了完整视图,因此我们所有人都可以看到代码-该项目将开源并放在github.com上,以供任何人使用。-完成编码后。)

struct ContentView: View {
    
    @State var showingDetail = false
    @State var stations: [Station] = []
    @State var posts: [Program] = []

   var body: some View {
        NavigationView {
            if posts.isEmpty {
                Text("Loading")
            } else {
                vstack(alignment: .leading){
                    //STATIONS
                    Text("Our Stations")
                    .linespacing(30)
                    .padding(5)
                    .font(.system(size: 30,weight: .heavy,design: .default))
                    ScrollView(.horizontal,showsIndicators: false) {
                                        HStack(alignment: .bottom,spacing: 10) {
                                            ForEach(stations) { station in
                                                //return
                                               Button(action: {
                                                   self.showingDetail.toggle()
                                               }) {
                                                RemoteImage(type: .url(URL(string:station.imageurl)!),errorView: { error in
                                                    Text(error.localizedDescription)
                                                },imageView: { image in
                                                    image
                                                    .resizable()
                                                    .renderingMode(.original)
                    /*                                .clipShape(Circle())
                                                    .shadow(radius: 10)
                                                    .overlay(Circle().stroke(Color.red,linewidth: 5))*/
                                                    .aspectRatio(contentMode: .fit)
                                                    .frame(width:200,height:200)
                                                },loadingView: {
                                                    Text("Loading ...")
                                                })
                                                .sheet(isPresented: self.$showingDetail) {
                                                        MediaPlayerView()
                                                }
                                            }
                                        }
                                            
                                        }.frame(height: 200)
                                    }.frame(height: 200)
                    
                    Divider()
                    //podcast
                    Text("Our Shows")
                    .linespacing(30)
                    .padding(5)
                    .font(.system(size: 30,showsIndicators: false) {
                        HStack(alignment: .bottom,spacing: 10) {
                            ForEach(posts) { post in
                                //return
                                NavigationLink(destination: podcasts(post: post)){
                                RemoteImage(type: .url(URL(string:post.icon)!),errorView: { error in
                                    Text(error.localizedDescription)
                                },imageView: { image in
                                    image
                                    .resizable()
                                    .renderingMode(.original)
    /*                                .clipShape(Circle())
                                    .shadow(radius: 10)
                                    .overlay(Circle().stroke(Color.red,linewidth: 5))*/
                                    .aspectRatio(contentMode: .fit)
                                    .frame(width:200,height:200)
                                },loadingView: {
                                    Text("Loading ...")
                                })
                                }
                            }
                        }.frame(height: 200)
                    }.frame(height: 200)
                }
            }
        }.onAppear {
            Api().getPosts { (posts) in
                self.posts = posts
            }
            Api().getStations { (stations) in
                           self.stations = stations
            }
        }.navigationBarTitle(Text("Home"))
    }
}

推送到工作表的主要代码

Button(action: {
                                                   self.showingDetail.toggle()
                                               }) {
                                                RemoteImage(type: .url(URL(string:station.imageurl)!),loadingView: {
                                                    Text("Loading ...")
                                                })
                                                .sheet(isPresented: self.$showingDetail) {
                                                        MediaPlayerView()
                                                }

在这是工作表代码

struct MediaPlayerView: View {
    var body: some View {
        Text(/*@START_MENU_TOKEN@*/"Hello,World!"/*@END_MENU_TOKEN@*/)
    }
}

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。