MySpaceSelectedControl

MySpaceSelectedControl

To create your own MySpace Selected Control template you create a class that implements MySpaceSelectedControlProtocol

Boilerplate

import SwiftUI
import mealzcore
import MealziOSSDK

@available(iOS 14, *)
public struct MyCustomMySpaceSelectedControlView: MySpaceSelectedControlProtocol {
    public func content(params: MySpaceSelectedControlParameters) -> some View {
        // your imp here
    }
}

Full Example

import SwiftUI
import MealziOSSDK
import mealzcore

@available(iOS 14, *)
public struct MyCustomMySpaceSelectedControlView: MySpaceSelectedControlProtocol {
    public func content(params: MySpaceSelectedControlParameters) -> some View {
        MealzSelectedControlView(
            selection: params.$selection,
            options: [.favorites, .history]
        )
    }
}

public struct MealzSelectedControlView<Selection: SelectedControlEnum & Equatable & Hashable>: View {
    @Binding var selection: Selection
    let options: [Selection]

    public var body: some View {
        GeometryReader { geometry in
            ZStack {
                Rectangle()
                    .fill(Color.mealzColor(.lightBackground))
                Rectangle()
                    .fill(Color.mealzColor(.primary))
                    .cornerRadius(Dimension.sharedInstance.xlCornerRadius)
                    .padding(2)
                    .frame(width: geometry.size.width / 2, height: 50)
                    .offset(x: selection == options[0] ? geometry.size.width * -0.25 : geometry.size.width  * 0.25, y: 0)
                    .animation(.interactiveSpring(), value: selection)
                    .frame(maxWidth: .infinity)

                HStack(spacing: 0) {
                    ForEach(options, id: \.self) { option in
                        SelectedControlTabView(
                            title: option.title,
                            icon: option.icon,
                            isSelected: selection == option
                        ) {
                            selection = option
                        }
                        .frame(width: geometry.size.width / 2)
                    }
                }
            }
            .frame(maxWidth: .infinity)
        }
        .frame(height: 50)
        .cornerRadius(Dimension.sharedInstance.xlCornerRadius)
        .padding(.horizontal, Dimension.sharedInstance.lPadding)
        .padding(.vertical, Dimension.sharedInstance.sPadding)
    }
}

@available(iOS 14, *)
private struct SelectedControlTabView: View {
    let title: String
    let icon: MealzIcons?
    let isSelected: Bool
    let onSelect: () -> Void

    var body: some View {
        Button(action: {
            withAnimation { onSelect() }
        }) {
            HStack {
                if let icon {
                    Image.mealzIcon(icon: icon)
                        .resizable()
                        .renderingMode(.template)
                        .frame(width: 18, height: 18)
                }
                Text(title)
                    .lineLimit(1)
                    .miamFontStyle(style: MiamFontStyleProvider.sharedInstance.bodyBigStyle)
            }
            .foregroundColor(
                isSelected ?
                Color.mealzColor(.standardLightText) :
                    Color.mealzColor(.standardDarkText)
            )
        }
    }
}

with

public struct MySpaceSelectedControlParameters {
    /// Current tab, either favorites or history
    @Binding public var selection: MySpaceSelectedControlPage

where

public enum MySpaceSelectedControlPage: SelectedControlEnum {
    case favorites
    case history

• MySpaceSelectedControlParameters