ValueButtons style
<Style def:Name="UiTariffValueButtonVisualStyle">
<StyleProperties>
<PropertyStyle Size="100,100"/>
<PropertyStyle Type="Units"/>
<PropertyStyle Image="\Storage Card\Media\pictures\tariff_fastButton.png"/>
<PropertyStyle DisableImage="\Storage Card\Media\pictures\tariff_fastButton_disabled.png"/>
<PropertyStyle SelectedImage="\Storage Card\Media\pictures\tariff_fastButton_selected.png"/>
<PropertyStyle ClickImage="\Storage Card\Media\pictures\tariff_fastButton.png"/>
<PropertyStyle Font="Arial, l8pt, style=Bold"/>
<PropertyStyle DurationTextColor="Black"/>
<PropertyStyle DurationTextColorWhenSelected="Black"/>
<PropertyStyle AmountTextColor="White"/>
<PropertyStyle AmountTextColorWhenSelected="SkyBlue"/>
<PropertyStyle Transparent="True"/>
<PropertyStyle TransparentColor="Black"/>
</StyleProperties>
</Style>
valueButtons in TFT panel
<!-- Page 1 - buttons 1 to 10 -->
<TFT:UiTariffValueButton Id="1" MxStyle="{UiTariffValueButtonVisnalStyle}" Location="100,580"/>
<TFT:UiTariffValueButton Id="2" MxStyle="{UiTariffValueButtonVisualStyle}" Location="220,580"/>
<TFT:UiTariffValueButton Id="3" MxStyle="{UiTariffValueButtonVisualStyle}" Location="340,580"/>
<TFT:UiTariffValueButton Id="4" MxStyle="{UiTariffValueButtonVisualStyle}" Location="460,580"/>
<TFT:UiTariffValueButton Id="5" MxStyle="{UiTariffValueButtonVisualStyle}" Location="580,580"/>
<TFT:UiTariffValueButton Id="6" MxStyle="{UiTariffValueButtonVisnalStyle}" Location="100,700"/>
<TFT:UiTariffValueButton Id="7" MxStyle="{UiTariffValueButtonVisualStyle}" Location="220,700"/>
<TFT:UiTariffValueButton Id="8" MxStyle="{UiTariffValueButtonVisualStyle}" Location="340,700"/>
<TFT:UiTariffValueButton Id="9" MxStyle="{UiTariffValueButtonVisualStyle}" Location="460,700"/>
<TFT:UiTariffValueButton Id="10" MxStyle="(UiTariffValueButtonVisualStyle}" Location="580,700"/>
<!-- Page 2 - button 11 -->
<TFT:UiTariffValueButton Id="11" MxStyle="{UiTariffValueButtonVisnalStyle}" Location="100,580"/>
<!-- Lefty and right arrow buttons -->
<TFT:UiTariffValueButton MxStyle="{UiTariffValueButtonVisualStyle}" Type="Left" Size="50,100" Location="10,630" Image="\Storage Card\Media\pictures\tariff_valueButton_left.png" DisableImage="\Storage Card\Media\pictures\tariff_valueButton_left_disabled.png"/>
<TFT:UiTariffValueButton MxStyle="{UiTariffValueButtonVisualStyle}" Type="Right" Size="50,100" Location="710,630" Image="\Storage Card\Media\pictures\tariff_valueButton_right.png" DisableImage="\Storage Card\Media\pictures\tariff_valueButton_right_disabled.png"/>
Value buttons page 1
Valeu buttons page 2