PriceVariant
Pre-defined styles for the Button component. There are three styles available: Regular, Comparison, BTI and TimeRestrictedOffer. Each style has its own unique characteristics.
See also
Samples
import androidx.compose.foundation.isSystemInDarkTheme
import androidx.compose.foundation.layout.*
import androidx.compose.runtime.*
import androidx.compose.ui.tooling.preview.Preview
import net.ikea.skapa.foundation.*
import net.ikea.skapa.ui.components.Price
import net.ikea.skapa.ui.components.PriceSize
import net.ikea.skapa.ui.components.PriceVariant
import java.util.*
fun main() {
//sampleStart
SkapaTheme2(isSystemInDarkTheme()) {
val currency = Currency.getInstance("EUR").symbol
val integerValue = "1 000"
val decimalValue = null
val label = "/meter"
Column(verticalArrangement = Arrangement.spacedBy(SkapaSpacing.space50)) {
// Standard
Price(
integerValue = integerValue,
decimalValue = "50",
currency = currency,
variant = PriceVariant.Regular(),
subscriptLabel = label
)
Price(
integerValue = integerValue,
decimalValue = decimalValue,
currency = currency,
variant = PriceVariant.Regular(),
subscriptLabel = label,
size = PriceSize.Small
)
// Comparison
Price(
integerValue = integerValue,
decimalValue = decimalValue,
currency = currency,
variant = PriceVariant.Comparison(),
subscriptLabel = label
)
// BTI
Price(
integerValue = integerValue,
decimalValue = decimalValue,
currency = currency,
variant = PriceVariant.BTI(),
subscriptLabel = label
)
}
}
//sampleEnd
}Inheritors
Types
The BTI (Breath Taking Item) price display styling highlights the price in a BTI box. This styling can only be applied on the leading price variation.
Comparison prices are used alongside an instance of a leading price. They are typically smaller than the leading price. This variant enforces PriceSizeStyle.FixedSize.
This is the leading price display used for most price presentations at IKEA. The price display has two style variations called PriceSizeStyle.MixedSize and PriceSizeStyle.FixedSize.
Time restricted offer price display styling highlights the price in a special color.