Customize product card using the custom view(restricted API) Flutter
This is a restricted API and we only support that on iOS now.
iOS
Create a custom view class to implement the ProductCardViewRepresentable protocol.
import FireworkVideo
class CustomProductView: UIView, ProductCardViewRepresentable {
lazy var label: UILabel = UILabel(frame: .zero)
lazy var detailsLabel: UILabel = .init(frame: .zero)
/**
Called before a product card is reused.
- Note: This is an opportunity to clean up the product card UI elements
*/
func prepareForReuse() {
label.text = ""
detailsLabel.text = ""
}
/**
Called before a product card will be displayed on screen
- Important: It is best to avoid network calls when this method is invoked. The product card is just moments from being rendered and network calls
at this stage would provide a degraded user experience. Please use the hydration API to perform any product data updates.
- Note: This is the opportunity to update the product card UI with product specific details
- Parameters:
- product: The product details associated to the view that will be displayed
- video: The details of the video the product is associated with.
*/
func updateViewForProduct(_ product: ProductCardDetails, associatedTo video: VideoDetails) {
label.text = product.name
detailsLabel.text = "$\(product.price.amount)"
}
}
Call FireworkVideoSDK.shopping.productCardViewType = CustomProductView.self at the appropriate place, such as application(:, didFinishLaunchingWithOptions:) -> Bool.