SwiftUI显示电量

请添加图片描述

import SwiftUI
struct ContentView: View {
    var body: some View {
            BatteryView()
            .frame(width: 170, height: 60)
            .padding()
    }
}
struct HalfCircleShape : Shape {
    func path(in rect: CGRect) -> Path {
        var path = Path()
        path.move(to: CGPoint(x: rect.minX, y: rect.midY))
        path.addArc(center: CGPoint(x: rect.minX, y: rect.midY), radius: rect.height , startAngle: .degrees(90), endAngle: .degrees(270), clockwise: true)
        return path
    }
}
struct BatteryView : View {
    init() {
        UIDevice.current.isBatteryMonitoringEnabled = true
    }
    var body: some View {
        // UIDevice.current.batteryLevel always returns -1, and I don't know why. so here's a value for you to preview
        let batteryLevel = 0.4
        GeometryReader { geo in
            HStack(spacing: 5) {
                GeometryReader { rectangle in
                    RoundedRectangle(cornerRadius: 15)
                        .stroke(lineWidth: 3)
                    RoundedRectangle(cornerRadius: 15)
                        .padding(5)
                        .frame(width: rectangle.size.width - (rectangle.size.width * (1 - batteryLevel)))
                        .foregroundColor(Color.BatteryLevel)
                }
                HalfCircleShape()
                .frame(width: geo.size.width / 7, height: geo.size.height / 7)
            }
            .padding(.leading)
        }
    }
}
extension Color {
    static var BatteryLevel : Color {
        let batteryLevel = 0.4
        print(batteryLevel)
        switch batteryLevel {
            // returns red color for range %0 to %20
            case 0...0.2:
                return Color.red
            // returns yellow color for range %20 to %50
            case 0.2...0.5:
                return Color.yellow
            // returns green color for range %50 to %100
            case 0.5...1.0:
                return Color.green
            default:
                return Color.clear
        }
    }
}
struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值