eliteKit: ProductView.xaml
<?xml version="1.0" encoding="utf-8" ?> | |
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" | |
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" | |
xmlns:d="http://xamarin.com/schemas/2014/forms/design" | |
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" | |
xmlns:ek="clr-namespace:eliteKit.eliteElements;assembly=eliteKit" | |
xmlns:converters="clr-namespace:DemoEliteKit.Converters" | |
xmlns:vm="clr-namespace:DemoEliteKit.ViewModels" | |
x:Class="DemoEliteKit.Views.ProductView" | |
mc:Ignorable="d"> | |
<ContentPage.BindingContext> | |
<vm:ProductViewModel/> | |
</ContentPage.BindingContext> | |
<ContentPage.Resources> | |
<converters:InverseBoolConverter x:Key="InverseBoolConverter"/> | |
</ContentPage.Resources> | |
<ContentPage.Content> | |
<StackLayout> | |
<ek:eliteHeader ColorPrimary="{StaticResource MainColor}" | |
ColorSecondary="{StaticResource AuxColor}" | |
VerticalOptions="Start" | |
HeightRequest="75"> | |
<ek:eliteHeader.HeaderView> | |
<Image Source="{Binding HeaderImage}" | |
HorizontalOptions="Center" | |
VerticalOptions="Center" | |
HeightRequest="84" | |
WidthRequest="75"/> | |
</ek:eliteHeader.HeaderView> | |
</ek:eliteHeader> | |
<ek:eliteLoaderRadial IsVisible="{Binding IsBusy}" | |
ColorPrimary="{StaticResource MainColor}" | |
ColorSecondary="{StaticResource AuxColor}" | |
VerticalOptions="Center" | |
HorizontalOptions="Center" | |
IsGradient="True" | |
HeightRequest="50" | |
WidthRequest="50"/> | |
<ScrollView> | |
<Grid Margin="10" IsVisible="{Binding IsBusy, Converter={StaticResource InverseBoolConverter}}"> | |
<Grid.RowDefinitions> | |
<RowDefinition Height="Auto"/> | |
<RowDefinition Height="Auto"/> | |
<RowDefinition Height="Auto"/> | |
<RowDefinition Height="Auto"/> | |
<RowDefinition Height="Auto"/> | |
<RowDefinition Height="Auto"/> | |
</Grid.RowDefinitions> | |
<Grid.ColumnDefinitions> | |
<ColumnDefinition Width="*"/> | |
<ColumnDefinition Width="2*"/> | |
<ColumnDefinition Width="Auto"/> | |
</Grid.ColumnDefinitions> | |
<Label Grid.Row="0" | |
Grid.Column="0" | |
VerticalOptions="Center" | |
Text="Product Name"/> | |
<Entry Grid.Row="0" | |
Grid.Column="1" | |
Text="{Binding ProductName}" | |
BackgroundColor="{StaticResource MainColor}" | |
TextColor="White" | |
VerticalOptions="Center"/> | |
<Label Grid.Row="1" | |
Grid.Column="0" | |
VerticalOptions="Center" | |
Text="Product Stock"/> | |
<ek:eliteSlider Grid.Row="1" | |
Grid.Column="1" | |
x:Name="stockSlider" | |
CurrentValue="{Binding ProductStock}" | |
ColorSliderBar="{StaticResource AuxColor}" | |
ColorSliderBarActive="{StaticResource MainColor}" | |
ColorThumb="{StaticResource MainColor}" | |
VerticalOptions="Center" | |
WidthRequest="200" | |
HeightRequest="50" | |
MinValue="0" | |
MaxValue="10"/> | |
<ek:eliteBadge Grid.Row="1" | |
Grid.Column="2" | |
ContentBadge="{Binding Source={x:Reference stockSlider}, Path=CurrentValue}" | |
x:Name="badge" | |
BadgeDirection="TopRight" | |
HorizontalOptions="Center" | |
VerticalOptions="Center"/> | |
<Label Grid.Row="2" | |
Grid.Column="0" | |
VerticalOptions="Center" | |
Text="Category"/> | |
<StackLayout Grid.Row="2" | |
Grid.Column="1" | |
Grid.ColumnSpan="2"> | |
<StackLayout Orientation="Horizontal"> | |
<ek:eliteRadiobutton IsChecked="{Binding IsTechnology}" | |
Style="{StaticResource ek_rbStyle}" | |
x:Name="rbTechnology"> | |
<ek:eliteRadiobutton.Triggers> | |
<DataTrigger TargetType="ek:eliteRadiobutton" | |
Binding="{Binding Source={x:Reference rbFood}, Path=IsChecked}" | |
Value="True"> | |
<Setter Property="IsChecked" | |
Value="False"/> | |
</DataTrigger> | |
</ek:eliteRadiobutton.Triggers> | |
</ek:eliteRadiobutton> | |
<Label Text="Technology" | |
VerticalOptions="Center"/> | |
<ek:eliteRadiobutton IsChecked="{Binding IsFood}" | |
Style="{StaticResource ek_rbStyle}" | |
x:Name="rbFood" | |
Margin="10,0,0,0"> | |
<ek:eliteRadiobutton.Triggers> | |
<DataTrigger TargetType="ek:eliteRadiobutton" | |
Binding="{Binding Source={x:Reference rbTechnology}, Path=IsChecked}" | |
Value="True"> | |
<Setter Property="IsChecked" | |
Value="False"/> | |
</DataTrigger> | |
</ek:eliteRadiobutton.Triggers> | |
</ek:eliteRadiobutton> | |
<Label Text="Food" | |
VerticalOptions="Center"/> | |
</StackLayout> | |
</StackLayout> | |
<Label Grid.Row="3" | |
Grid.Column="0" | |
VerticalOptions="Center" | |
Text="Discontinued?"/> | |
<ek:eliteCheckbox Grid.Row="3" | |
Grid.Column="1" | |
IsChecked="{Binding Discontinued}" | |
ColorUnchecked="{StaticResource AuxColor}" | |
ColorChecked="{StaticResource MainColor}" | |
ColorHighlighted="{StaticResource MainColor}" | |
ColorIcon="White" | |
WidthRequest="50" | |
HeightRequest="50" | |
VerticalOptions="Center" | |
HorizontalOptions="Start" | |
HasShadow="True"/> | |
<StackLayout Grid.Row="4" | |
Grid.Column="0" | |
Grid.ColumnSpan="3"> | |
<StackLayout Orientation="Horizontal" HorizontalOptions="Center"> | |
<ek:eliteButtonOutline ButtonClickCommand="{Binding ValidateCommand}" | |
ColorPrimary="{StaticResource MainColor}" | |
ColorSecondary="{StaticResource AuxColor}" | |
WidthRequest="150" | |
HeightRequest="60" | |
ColorText="White" | |
IsGradient="True" | |
HorizontalOptions="Center" | |
VerticalOptions="Center" | |
ButtonTitle="Validate"/> | |
<ek:eliteButton IsEnabled="{Binding IsValid}" | |
ButtonClickCommand="{Binding RegisterCommand}" | |
WidthRequest="150" | |
HeightRequest="60" | |
ColorText="White" | |
IsGradient="True" | |
HorizontalOptions="Center" | |
VerticalOptions="Center" | |
ButtonTitle="Register" | |
Margin="10,0,0,0"> | |
<ek:eliteButton.Triggers> | |
<DataTrigger TargetType="ek:eliteButton" | |
Binding="{Binding IsValid}" | |
Value="false"> | |
<Setter Property="ColorPrimary" | |
Value="{StaticResource DeActivatedMainColor}"/> | |
<Setter Property="ColorSecondary" | |
Value="{StaticResource DeActivatedAuxColor}"/> | |
</DataTrigger> | |
<DataTrigger TargetType="ek:eliteButton" | |
Binding="{Binding IsValid}" | |
Value="true"> | |
<Setter Property="ColorPrimary" | |
Value="{StaticResource MainColor}"/> | |
<Setter Property="ColorSecondary" | |
Value="{StaticResource AuxColor}"/> | |
</DataTrigger> | |
</ek:eliteButton.Triggers> | |
</ek:eliteButton> | |
</StackLayout> | |
</StackLayout> | |
<ek:eliteProgressBar Grid.Row="5" | |
Grid.Column="0" | |
Grid.ColumnSpan="3" | |
ColorPrimary="{StaticResource MainColor}" | |
ColorSecondary="{StaticResource AuxColor}" | |
ColorBackground="LightGray" | |
IsGradient="True" | |
CurrentValue="{Binding SaveProgress}"> | |
<ek:eliteProgressBar.Triggers> | |
<DataTrigger TargetType="ek:eliteProgressBar" | |
Binding="{Binding SaveProgress}" | |
Value="0"> | |
<Setter Property="IsVisible" | |
Value="False"/> | |
</DataTrigger> | |
</ek:eliteProgressBar.Triggers> | |
</ek:eliteProgressBar> | |
<Label Grid.Row="5" | |
Grid.Column="0" | |
Grid.ColumnSpan="3" | |
Text="{Binding SaveProgress, StringFormat='Saving... {0}%'}" | |
TextColor="DarkGreen" | |
FontAttributes="Bold" | |
FontSize="Large" | |
HorizontalOptions="Center" | |
VerticalOptions="Center"> | |
<Label.Triggers> | |
<DataTrigger TargetType="Label" | |
Binding="{Binding SaveProgress}" | |
Value="0"> | |
<Setter Property="IsVisible" | |
Value="False"/> | |
</DataTrigger> | |
</Label.Triggers> | |
</Label> | |
</Grid> | |
</ScrollView> | |
<ek:eliteFooter ColorPrimary="{StaticResource MainColor}" | |
ColorSecondary="{StaticResource AuxColor}" | |
VerticalOptions="EndAndExpand" | |
HeightRequest="75"> | |
<ek:eliteFooter.FooterView> | |
<Image Source="{Binding FooterImage}" | |
WidthRequest="75" | |
HeightRequest="75" | |
VerticalOptions="Center" | |
HorizontalOptions="Center"/> | |
</ek:eliteFooter.FooterView> | |
</ek:eliteFooter> | |
</StackLayout> | |
</ContentPage.Content> | |
</ContentPage> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment