weibo/Weibo/IndexView.swift

//
//  IndexView.swift
//  Weibo
//
//  Created by Qihua Pan on 2020/8/18.
//  Copyright © 2020 Qihua Pan. All rights reserved.
//

import SwiftUI
import AlamofireImage


struct ButtonView:View{
    var title:String
    var action:() -> Void

    @Binding var activeMenu:String
    
     func isActive(name:String)->Color{
         if name==self.activeMenu{
             return Color.orange
         }else{
             return Color.black
         }
     }
    
    var body: some View{
        Button(action: action) {
            Text(title)
                .foregroundColor(isActive(name: title))
        }
        .padding(.all, 10.0)
        .frame(width: 90.0)
        .background(Color(red: 222/255, green: 223/255, blue: 222/255, opacity: 1.0))
        .clipShape(Rectangle())
        .cornerRadius(3)
    }
}

struct TextView:View {
    var title:String
    var isActive:Bool
     var body: some View{
        if isActive{
            return Text(title)
            .foregroundColor(Color.black)
            .fontWeight(/*@START_MENU_TOKEN@*/.bold/*@END_MENU_TOKEN@*/)
        }else{
            return Text(title)
            .foregroundColor(Color.gray)
        }
    }
}

struct TopView:View {
    
    @Binding var icon: String
    
    @State var activeMenu:String="全部关注"
    
    @State var menuIndex=0
 
    var body: some View{
        VStack {
            HStack {
                Image("user-search-line")
                Spacer()
                HStack{
                    Button(action: {
                        if self.icon=="arrowbottom"{
                            self.icon="arrowtop"
                        }else{
                            self.icon="arrowbottom"
                        }
                        self.menuIndex=0
                    }) {
                        HStack {
                            TextView(title: self.activeMenu, isActive: self.menuIndex==0)
                            Image(self.icon)
                                .padding(.leading, -9.0)
                                
                        }
                    }
                    Button(action: {
                        print("推荐")
                        self.menuIndex=1
                    }){
                        TextView(title: "推荐", isActive: self.menuIndex==1)
                    }
                    Button(action: {
                        print("同城")
                        self.menuIndex=2
                    }){
                        TextView(title: "同城", isActive: self.menuIndex==2)
                    }
                }
                Spacer()
                HStack(){
                       Image("red packet")
                       Image("edit")
                }
                .padding(.trailing, 18.0)
                .frame(width: nil)
                
            }
           
            if self.icon=="arrowbottom"{
                HStack {
                    Text("默认分组")
                        .foregroundColor(Color.gray)
                    Spacer()
                    Button(action: {
                        print("编辑分组")
                    }){
                        Text("编辑")
                            .foregroundColor(Color.orange)
                    }
                }
                .padding(EdgeInsets(top: 5, leading: 20, bottom: 0, trailing: 20))
                HStack(spacing: 10.0){
                    ButtonView(title: "全部关注", action: {
                        print("全部关注")
                        self.activeMenu="全部关注"
                        self.icon="arrowtop"
                    },activeMenu: self.$activeMenu)
                    ButtonView(title: "最新微博", action: {
                        print("最新微博")
                        self.activeMenu="最新微博"
                        self.icon="arrowtop"
                    },activeMenu: self.$activeMenu)
                    ButtonView(title: "特别关注", action: {
                        print("特别关注")
                        self.activeMenu="特别关注"
                        self.icon="arrowtop"
                    },activeMenu: self.$activeMenu)
                    ButtonView(title: "好友圈", action: {
                        print("好友圈")
                        self.activeMenu="好友圈"
                        self.icon="arrowtop"
                    },activeMenu: self.$activeMenu)
                }
                .padding(.top, 10.0)
                HStack(spacing: 10.0){
                    ButtonView(title: "原创", action: {
                        print("原创")
                        self.activeMenu="原创"
                        self.icon="arrowtop"
                    },activeMenu: self.$activeMenu)
                    ButtonView(title: "视频", action: {
                        print("视频")
                        self.activeMenu="视频"
                        self.icon="arrowtop"
                    },activeMenu: self.$activeMenu)
                    ButtonView(title: "V+微博", action: {
                        print("V+微博")
                        self.activeMenu="V+微博"
                        self.icon="arrowtop"
                    },activeMenu: self.$activeMenu)
                    ButtonView(title: "群微博", action: {
                        print("群微博")
                        self.activeMenu="群微博"
                        self.icon="arrowtop"
                    },activeMenu: self.$activeMenu)
                }
                .padding(.top, 10.0)
                HStack {
                    Text("我的分组")
                        .foregroundColor(Color.gray)
                        .padding(.leading, 20.0)
                    Spacer()
                }
                .padding(.top, 10.0)
                HStack(spacing: 10.0){
                    ButtonView(title: "名人明星", action: {
                        print("名人明星")
                        self.activeMenu="名人明星"
                        self.icon="arrowtop"
                    },activeMenu: self.$activeMenu)
                    ButtonView(title: "同事", action: {
                        print("同事")
                        self.activeMenu="同事"
                        self.icon="arrowtop"
                    },activeMenu: self.$activeMenu)
                    ButtonView(title: "同学", action: {
                        print("同学")
                        self.activeMenu="同学"
                        self.icon="arrowtop"
                    },activeMenu: self.$activeMenu)
                    ButtonView(title: "悄悄关注", action: {
                        print("悄悄关注")
                        self.activeMenu="悄悄关注"
                        self.icon="arrowtop"
                    },activeMenu: self.$activeMenu)
                }
                .padding(.top, 10.0)
                HStack(){
            
                        Button(action: /*@START_MENU_TOKEN@*/{}/*@END_MENU_TOKEN@*/) {
                            Text("+新建分组")
                        }
                        .foregroundColor(Color.black)
                        .padding(10.0)
                        .frame(width: 100.0)
                        .overlay(Rectangle()
                        .stroke(Color.gray, style: StrokeStyle(lineWidth: 2, dash: [5])))
                        Spacer()
         
                }
                .padding(10.0)
            }
        }
    }
}

struct ImageView:View {
    @Binding var imageUrl:String
    var body: some View{
        Image(uiImage: requestImage(url: imageUrl))
    }
    
    func requestImage(url:String)->UIImage{
        
        let data = try! Data(contentsOf: URL(string: url)!)
        let image = UIImage(data: data, scale: UIScreen.main.scale)!
        image.af.inflate()
        return image
    }
}

struct Content {
    
}

struct RowView:View {
    var content:Content
    var body: some View{
        HStack{
          Text("vvv")
        }
    }
}

struct IndexView: View {
    
    @State var icon: String="arrowtop"
    
    var body: some View {
        VStack {
            TopView(icon: $icon)
//            RowView()
            Spacer()
        }
    }
}

struct IndexView_Previews: PreviewProvider {
    static var previews: some View {
        IndexView()
    }
}