Course Card Component
Course card contains multiple card variants that all include a large image element in addition to title, description, Rating Location information,Time information etc. The whole course card is tappable
Card Type:
-
Basic - This card type containing Image, Title and Description
-
Yuble - This card type containing Image, Rating, Title, Description and Location informations.
-
Queuo - This card type containing Image, Title, Pill view, Location and Time informations.
Parameters:
/// - image: Display image on course card /// - title: Title of course card /// - rating: Rating value /// - description: Description of course card /// - pillText: Text on pill /// - address: Address of course card /// - date: Date of course card /// - time: Time of course card
Style Parameters:
/// - backgoundColor: Set backgoundColor for course card /// - pillColor: Color of pill /// - mapIconColor: Map icon color /// - timeIconColor: Time icon color
Features
- Update Image, Rating, Title, Pill text, Description, Location and Time informations
Installation
-
Copy the
CourseCard
component folder into your Xcode project. -
Use the
OCCourseCardView
view in your SwiftUI code:
import SwiftUI
struct ContentView: View
var body: some View {
VStack {
let title = "Course card title"
let description = "Teasertext goes here in maximum of four lines. Cut off (after number of characters/words, when line ends?) with three dots. "
let address = ["Address Line 1", "Address Line 2"]
let courseCardData = OCCourseCardData(image: .local(image: Image("PlaceholderFeedCard"), title: title, rating: 3.5, description: description, pillText: "Label", address: address, date: "Date", time: "Time")
OCCourseCard(cardType: .yuble, cardData: courseCardData, onSelectCard: { cardInfo in
debugPrint("Course Card \(cardInfo.title ?? .empty) selected")
})
}.padding(.horizontal, 16)
}
}