import SwiftUI

    / 今日分析 / struct TodayPreviewView: View { var body: some View { VStack{ ZStack{ HStack{ Button {

    1.                 } label: {
    2.                     Image(systemName: "line.horizontal.3")
    3.                         .resizable()
    4.                         .frame(width: 20, height: 15)
    5.                         .foregroundColor(.black)
    6.                 }
    8.                 Spacer()
    10.                 Button {
    12.                 } label: {
    13.                     Image(systemName: "bell.fill")
    14.                         .foregroundColor(.black)
    15.                 }
    16.             }
    17.             Text("My Usage")
    18.                 .fontWeight(.bold)
    19.         }
    20.         .padding(.top, UIApplication.shared.windows.first?.safeAreaInsets.top)
    21.         .padding()
    22.         .overlay {
    23.             Rectangle().stroke(Color.black.opacity(0.05), lineWidth: 2)
    24.         }
    26.         // create pie chart
    27.         GeometryReader { g in
    28.             ZStack{
    29.                 ForEach(0..<pieData.count){i in
    30.                     DrawShape(center: CGPoint(x: g.frame(in: .global).width / 2, y: g.frame(in: .global).height / 2), index: i)

    // Path{path in // path.move(to: CGPoint(x: UIScreen.main.bounds.width / 2, y: UIScreen.main.bounds.height / 2)) // path.addArc(center: CGPoint(x: UIScreen.main.bounds.width / 2, y: UIScreen.main.bounds.height / 2), radius: 180, startAngle: .zero, endAngle: .init(degrees: 90), clockwise: false) // } // .fill(Color.yellow) } } } .frame(height: 360) .padding(.top, 20) .clipShape(Circle()) .shadow(radius: 8)

    1.         // since it is in circle shape so were going to clip it in circle...
    3.         // since radius is 180 so circle size will be 360
    4.         VStack{
    5.             ForEach(pieData){i in
    6.                 HStack{
    7.                     Text(i.name)
    8.                         .frame(width: 100)
    10.                     // fixed width...
    12.                     GeometryReader { g in
    13.                         HStack{
    14.                             Spacer(minLength: 0)
    16.                             Rectangle()
    17.                             .fill(i.color)
    18.                             .frame(width: getWidth(width: g.frame(in: .global).width, value: i.percent), height: 10)
    20.                             Text(String(format: "\(i.percent)", "%.0f"))
    21.                                 .fontWeight(.bold)
    22.                                 .padding(.leading, 10)
    23.                         }
    24.                     }
    25.                 }
    26.                 .padding(.top, 18)
    27.             }
    28.         }
    29.         .padding()
    31.         Spacer()
    32.     }
    33.     .edgesIgnoringSafeArea(.top)
    34. }
    36. func getWidth(width: CGFloat, value : CGFloat) -> CGFloat{
    37.     let temp = value / 100
    38.     return temp * width
    39. }

    }

    struct DrawShape: View{ var center: CGPoint var index : Int

    1. var body: some View{
    2.     Path{path in
    3.         path.move(to: self.center)
    4.         path.addArc(center: self.center, radius: 180, startAngle: .init(degrees: from()), endAngle: .init(degrees: to()), clockwise: false)
    5.     }
    6.     .fill(pieData[index].color)
    7. }
    9. func from() -> Double{
    10.     if index <= 0{
    11.         return 0
    12.     }
    14.     var temp : Double = 0
    15.     for i in 0...index-1{
    16.         temp += Double(pieData[i].percent / 100) * 360
    17.     }
    19.     return temp
    20. }
    22. func to() -> Double{
    23.     var temp : Double = 0
    24.     // because we need current degree
    25.     for i in 0...index{
    26.         temp += Double(pieData[i].percent / 100) * 360
    27.     }
    29.     return temp
    30. }

    }

    struct TodayPreviewView_Previews: PreviewProvider { static var previews: some View { TodayPreviewView() } }

    // sample data struct Pie : Identifiable{ var id : Int var percent: CGFloat var name: String var color: Color }

    var pieData = [ Pie(id: 0, percent: 10, name: “测试”, color: Color.green), Pie(id: 1, percent: 20, name: “墨鱼🦑”, color: Color.red), Pie(id: 2, percent: 15, name: “工作”, color: Color.purple), Pie(id: 3, percent: 50, name: “学习”, color: Color.gray), Pie(id: 4, percent: 5, name: “睡眠”, color: Color.yellow), ] ```