bogdan Refresh app UI with themed meter views

d426752 2 weeks ago History

//
//  File.swift
//  USB Meter
//
//  Created by Bogdan Timofte on 08/05/2020.
//  Copyright © 2020 Bogdan Timofte. All rights reserved.
//

import SwiftUI

struct RoundedRectangleBackground: ViewModifier {
    
    var cornerRadius: CGFloat
    var foregroundColor: Color
    var opacity: Double
    var blurRadius: CGFloat

    func body(content: Content) -> some View {
        content.background(
            RoundedRectangle(cornerRadius: cornerRadius)
                .foregroundColor(foregroundColor)
                .opacity(opacity)
        .blur(radius: blurRadius)
        )
    }
}

struct RoundedRectangleBorder: ViewModifier {
    
    var cornerRadius: CGFloat
    var foregroundColor: Color
    var lineWidth: CGFloat
    var blurRadius: CGFloat
    
    func body(content: Content) -> some View {
        content.background(
            RoundedRectangle(cornerRadius: cornerRadius)
                .stroke(lineWidth: lineWidth)
                .foregroundColor(foregroundColor)
                .blur(radius: blurRadius)
        )
    }
}

struct MeterCardStyle: ViewModifier {
    var tint: Color
    var fillOpacity: Double
    var strokeOpacity: Double
    var cornerRadius: CGFloat

    func body(content: Content) -> some View {
        content
            .background(
                RoundedRectangle(cornerRadius: cornerRadius, style: .continuous)
                    .fill(
                        LinearGradient(
                            colors: [
                                tint.opacity(fillOpacity),
                                Color.secondary.opacity(fillOpacity * 0.75)
                            ],
                            startPoint: .topLeading,
                            endPoint: .bottomTrailing
                        )
                    )
            )
            .overlay(
                RoundedRectangle(cornerRadius: cornerRadius, style: .continuous)
                    .stroke(tint.opacity(strokeOpacity), lineWidth: 1.25)
            )
            .shadow(color: tint.opacity(fillOpacity * 0.9), radius: 14, x: 0, y: 8)
    }
}

extension View {
    func withRoundedRectangleBackground( cornerRadius: CGFloat, foregroundColor: Color, opacity: Double, blurRadius: CGFloat = 0 ) -> some View {
        self.modifier(RoundedRectangleBackground(cornerRadius: cornerRadius, foregroundColor: foregroundColor, opacity: opacity, blurRadius: blurRadius))
    }
    
    func withRoundedRectangleBorder( cornerRadius: CGFloat, foregroundColor: Color, lineWidth: CGFloat, blurRadius: CGFloat = 0 ) -> some View {
        self.modifier(RoundedRectangleBorder(cornerRadius: cornerRadius, foregroundColor: foregroundColor, lineWidth: lineWidth, blurRadius: blurRadius ))
    }

    func meterCard(
        tint: Color = .primary,
        fillOpacity: Double = 0.14,
        strokeOpacity: Double = 0.22,
        cornerRadius: CGFloat = 22
    ) -> some View {
        self.modifier(
            MeterCardStyle(
                tint: tint,
                fillOpacity: fillOpacity,
                strokeOpacity: strokeOpacity,
                cornerRadius: cornerRadius
            )
        )
    }
}

// MARK: Local
extension Button {
    func asEnableFeatureButton(state: Bool) -> some View {
        self
            .foregroundColor(state ? .white : .blue)
            .padding(.horizontal, 12)
            .padding(.vertical, 8)
            .frame(minWidth: 84)
            .withRoundedRectangleBackground(cornerRadius: 15, foregroundColor: state ? .blue : .blue, opacity: state ? 0.88 : 0.12)
            .withRoundedRectangleBorder(cornerRadius: 15, foregroundColor: .blue, lineWidth: 1.5, blurRadius: 0.1)
    }
}