Skip to content

Instantly share code, notes, and snippets.

@gingofthesouth
Last active June 23, 2020 03:45
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save gingofthesouth/e06c888468b96eae70fe834705492a02 to your computer and use it in GitHub Desktop.
Save gingofthesouth/e06c888468b96eae70fe834705492a02 to your computer and use it in GitHub Desktop.
An Apple like card view in SwiftUI
//
// CardView.swift
//
// Created by Ernest Cunningham on 27/05/20.
//
import SwiftUI
struct CardView<CardContent: View>: View {
@Environment(\.colorScheme) var mode
let cardContent: () -> CardContent
let shadowColour: Color
let cardFill: Color
init(@ViewBuilder cardContent: @escaping () -> CardContent,
shadowColour: Color = .shadowColor(),
cardFill: Color = .backgroundColor()) {
self.cardContent = cardContent
self.shadowColour = shadowColour
self.cardFill = cardFill
}
var body: some View {
ZStack {
RoundedRectangle(cornerRadius: 15, style: .continuous)
.fill(cardFill)
.shadow(color: shadowColour, radius: 12).opacity(0.3)
VStack {
cardContent()
}
.padding(20)
.multilineTextAlignment(.center)
}.frame(maxWidth: 100001, maxHeight: 200, alignment: .center)
.padding(20)
}
}
struct CardView_Previews: PreviewProvider {
static var previews: some View {
Group {
CardView(cardContent: {
Text("Title").font(.title)
Text("SubTitle").font(.subheadline)
}, shadowColour: .gray, cardFill: .white)
.environment(\.colorScheme, .light)
CardView(cardContent: {
Text("Dark Mode").font(.title)
Text("With Text").font(.subheadline)
}, shadowColour: .gray)
.environment(\.colorScheme, .dark)
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment