Add discount price to PXLProduct and a UI Component(PXLPhotoProductView)

a new example to the demo app

• how to access the example: Launch the app > main screen > tap Product View button

[Data] Added new fields to PXLProduct

• these fields are added to provide discount price information

#!java
public class PXLProduct implements Parcelable {
...
    @FieldDate
    @Json(name = "sales_start_date")
    public Date salesStartDate;

    @FieldDate
    @Json(name = "sales_end_date")
    public Date salesEndDate;

    @FieldBigDecimal
    @Json(name = "sales_price")
    public BigDecimal salesPrice;
...
}

[UI] Added a new option to PXLPhotoProductView for sales price

FYI, the color and size of the sales price and the default price are fully customizable via CurrencyTextStyle class.

• discountPriceTextStyle: ProductViewHolder.DiscountPrice(..) is added to PXLPhotoProductView.Configuration

  • priceTextStyle = CurrencyTextStyle

    • isCurrencyLeading:Boolean is added to CurrencyTextStyle. priceTextStyle has the same change as well.
      • true: display currency symbol in front of the price
      • false: display currency symbol after the price

  • DiscountLayout's options

.CROSS_THROUGH	.WAS_OLD_PRICE	.WITH_DISCOUNT_LABEL

No Option selected or no sales price	Demo

• Code Example
  • To display sales price, you need to set discountPriceTextStyle = ProductViewHolder.DiscountPrice(..). Please see the example codes below.

  #!kotlin
  pxlPhotoProductView
            .setContent(photoInfo = ...,
                headerConfiguration = ...,
                configuration = ProductViewHolder.Configuration().apply {
                    circleIcon = ...
                    mainTextStyle = ...
                    subTextStyle = ..
                    bookmarkDrawable = ..
                    priceTextStyle = ...
                    discountPriceTextStyle = ProductViewHolder.DiscountPrice(
                            discountLayout = ProductViewHolder.DiscountLayout.WITH_DISCOUNT_LABEL,
                            priceTextStyle = CurrencyTextStyle().apply {
                                isCurrencyLeading = true
                                defaultCurrency = "EUR" // or null
                                leftText = TextStyle().apply {
                                    color = Color.RED
                                    size = 24.px
                                    sizeUnit = TypedValue.COMPLEX_UNIT_PX
                                    typeface = null
                                }
  
                                rightText = TextStyle().apply {
                                    color = Color.RED
                                    size = 14.px
                                    sizeUnit = TypedValue.COMPLEX_UNIT_PX
                                    typeface = null
                                }
                            }
                    )
                },
                bookmarkMap = ..,
                onProductClicked = {
                    ...
                })