Design/net.ikea.skapa.ui.components/PriceModule

PriceModule

fun PriceModule(productName: String, productDescription: String, currentPriceParams: PriceParams, modifier: Modifier = Modifier, variant: PriceModuleVariant = PriceModuleVariant.Regular(size = PriceModuleSizeRegular.Medium, placeholder = false), energy: @Composable () -> Unit? = null, priceOfferType: PriceOfferType = PriceOfferType.Regular, priceAddons: List<String>? = null, secondCurrencyPriceParams: SecondCurrencyPriceParams? = null, offerMessage: OfferMessageItem? = null, edsMessage: String? = null, mergeDescendantsStrategy: MergeDescendantsStrategy = MergeDescendantsStrategy.Default)(source)

Price Module communicates product information and price for different scenarios.

PriceModuleVariant.Regular (Default) is great for displaying multiple products side by side. Our prices are displayed boldly, and it’s easy to get key product information at a glance.

PriceModuleVariant.List is best suited for vertical lists. While the price is smaller in this variant, it’s still easy to see at a glance. This variant could be a good fit when users are managing a group of products.

Example of usage:

Parameters

productName

Product name, should be capitalised, may include localized product name.

productDescription

A short product description, or product type.

currentPriceParams

Parameters for Current Price.

modifier

Modifier to be applied to the PriceModule.

variant

PriceModuleVariant per above.

energy

Composable for Energy class.

priceOfferType

Price offer type: PriceOfferType.Regular, PriceOfferType.BTI, PriceOfferType.New, PriceOfferType.NewBTI, PriceOfferType.NewLowerPrice, PriceOfferType.IkeaFamilyPrice, PriceOfferType.TimeRestrictedOffer, PriceOfferType.NewTimeRestrictedOffer.

priceAddons

List of strings for PriceAddons.

secondCurrencyPriceParams

Parameters Second price. This can be used if there is a need for providing a secondary currency.

offerMessage

Custom field to use for presenting an offer message for the product.

edsMessage

String used for presenting an End-Date-Sale (EDS) message for the product.

mergeDescendantsStrategy

Use this to customize merging semantic nodes.

Samples

SkapaTheme2(isSystemInDarkTheme()) {
    val productName = "PRODUCT NAME"
    val productDescription = "Product description"
    val comparisonParams = PriceParams(
        "15",
        "00",
        Currency.getInstance("EUR").symbol,
        DecimalSign.Comma,
        currencyPosition = CurrencyPosition.Trailing,
        captionPrefix = "Price was:"
    )
    val priceParams = PriceParams(
        "10",
        "00",
        Currency.getInstance("EUR").symbol,
        DecimalSign.Comma,
        currencyPosition = CurrencyPosition.Trailing,
        captionPrefix = "Price:"
    )

    Column(
        verticalArrangement = Arrangement.spacedBy(SkapaSpacing.space150),
        modifier = Modifier
            .padding(horizontal = 16.dp)
            .verticalScroll(rememberScrollState())
    ) {
        val regularVariant = PriceModuleVariant.Regular(PriceModuleSizeRegular.Medium, false)
        PriceModule(
            productName = productName,
            productDescription = productDescription,
            currentPriceParams = priceParams,
            variant = regularVariant,
            offerMessage = OfferMessageItem("IKEA Family offer 20% off", variant = OfferMessageVariant.IkeaFamily)
        )
        PriceModule(
            productName = productName,
            productDescription = productDescription,
            currentPriceParams = priceParams,
            variant = regularVariant,
            priceOfferType = PriceOfferType.BTI
        )
        PriceModule(
            productName = productName,
            productDescription = productDescription,
            currentPriceParams = priceParams,
            variant = regularVariant,
            priceOfferType = PriceOfferType.New("New")
        )
        PriceModule(
            productName = productName,
            productDescription = productDescription,
            currentPriceParams = priceParams,
            variant = regularVariant,
            priceOfferType = PriceOfferType.NewLowerPrice("New lower price"),
            priceAddons = listOf("Previous price: 00,00€")
        )
        PriceModule(
            productName = productName,
            productDescription = productDescription,
            currentPriceParams = priceParams,
            variant = regularVariant,
            priceOfferType = PriceOfferType.IkeaFamilyPrice("IKEA Family price"),
            priceAddons = listOf(
                "Regular price: 00,00€", "Price valid 04 Oct - 28 Nov or while supply lasts"
            )
        )
        PriceModule(
            productName = productName,
            productDescription = productDescription,
            currentPriceParams = priceParams,
            variant = regularVariant,
            priceOfferType = PriceOfferType.TimeRestrictedOffer(comparisonParams),
            edsMessage = "Last chance to buy",
            priceAddons = listOf(
                "Regular price: 00,00€", "Price valid 04 Oct - 28 Nov or while supply lasts"
            )
        )

        // Specify "Complete price" if want to use it to present a price for a budle of products.
        val regularVariantCompletePrice = PriceModuleVariant.Regular(PriceModuleSizeRegular.Medium, false, "Complete price")
        PriceModule(
            productName = productName,
            productDescription = productDescription,
            currentPriceParams = priceParams,
            variant = regularVariantCompletePrice
        )

        val listVariant = PriceModuleVariant.List(PriceModuleSizeList.Small)

        PriceModule(
            productName = productName,
            productDescription = productDescription,
            currentPriceParams = priceParams,
            variant = listVariant,
            priceOfferType = PriceOfferType.IkeaFamilyPrice("IKEA Family price"),
            priceAddons = listOf(
                "Regular price: 00,00€", "Price valid 04 Oct - 28 Nov or while supply lasts"
            )
        )
        PriceModule(
            productName = productName,
            productDescription = productDescription,
            currentPriceParams = priceParams,
            variant = listVariant,
            priceOfferType = PriceOfferType.TimeRestrictedOffer(comparisonParams),
            priceAddons = listOf(
                "Regular price: 00,00€", "Price valid 04 Oct - 28 Nov or while supply lasts"
            )
        )
    }
}

PriceModule

Parameters

See also

Samples