New grid layout structure for cipher view cell

This commit is contained in:
Kyle Spearrin 2019-06-21 09:46:46 -04:00
parent 3475d39f37
commit 9d3165dc65
3 changed files with 75 additions and 59 deletions

View file

@ -4,83 +4,103 @@
x:Class="Bit.App.Controls.CipherViewCell" x:Class="Bit.App.Controls.CipherViewCell"
xmlns:controls="clr-namespace:Bit.App.Controls" xmlns:controls="clr-namespace:Bit.App.Controls"
xmlns:ff="clr-namespace:FFImageLoading.Forms;assembly=FFImageLoading.Forms"> xmlns:ff="clr-namespace:FFImageLoading.Forms;assembly=FFImageLoading.Forms">
<Grid x:Name="_grid"
StyleClass="list-row, list-row-platform" <Grid
RowSpacing="0" x:Name="_grid"
ColumnSpacing="0" StyleClass="list-row, list-row-platform"
x:DataType="controls:CipherViewCellViewModel"> RowSpacing="0"
ColumnSpacing="0"
x:DataType="controls:CipherViewCellViewModel">
<Grid.BindingContext> <Grid.BindingContext>
<controls:CipherViewCellViewModel /> <controls:CipherViewCellViewModel />
</Grid.BindingContext> </Grid.BindingContext>
<Grid.RowDefinitions> <Grid.RowDefinitions>
<RowDefinition Height="*" /> <RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions> </Grid.RowDefinitions>
<Grid.ColumnDefinitions> <Grid.ColumnDefinitions>
<ColumnDefinition Width="40" /> <ColumnDefinition Width="40" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" /> <ColumnDefinition Width="*" />
<ColumnDefinition Width="60" /> <ColumnDefinition Width="60" />
</Grid.ColumnDefinitions> </Grid.ColumnDefinitions>
<controls:FaLabel x:Name="_icon" <controls:FaLabel
Grid.Column="0" x:Name="_icon"
Grid.Row="0" Grid.Row="0"
Grid.RowSpan="2" Grid.Column="0"
HorizontalOptions="Center" HorizontalOptions="Center"
VerticalOptions="Center" VerticalOptions="Center"
StyleClass="list-icon, list-icon-platform" /> StyleClass="list-icon, list-icon-platform" />
<ff:CachedImage x:Name="_image"
Grid.Column="0" <ff:CachedImage
Grid.Row="0" x:Name="_image"
Grid.RowSpan="2" Grid.Row="0"
BitmapOptimizations="True" Grid.Column="0"
ErrorPlaceholder="login.png" BitmapOptimizations="True"
HorizontalOptions="Center" ErrorPlaceholder="login.png"
VerticalOptions="Center" HorizontalOptions="Center"
WidthRequest="22" VerticalOptions="Center"
HeightRequest="22" WidthRequest="22"
IsVisible="False"/> HeightRequest="22"
<Label LineBreakMode="TailTruncation" IsVisible="False"/>
Grid.Column="1"
<Grid RowSpacing="0" ColumnSpacing="0" Grid.Row="0" Grid.Column="1" VerticalOptions="Center">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Label
LineBreakMode="TailTruncation"
Grid.Column="0"
Grid.Row="0" Grid.Row="0"
StyleClass="list-title, list-title-platform" StyleClass="list-title, list-title-platform"
Text="{Binding Cipher.Name, Mode=OneWay}" /> Text="{Binding Cipher.Name, Mode=OneWay}" />
<Label LineBreakMode="TailTruncation" <Label
Grid.Column="1" LineBreakMode="TailTruncation"
Grid.Column="0"
Grid.Row="1" Grid.Row="1"
Grid.ColumnSpan="3" Grid.ColumnSpan="3"
StyleClass="list-subtitle, list-subtitle-platform" StyleClass="list-subtitle, list-subtitle-platform"
Text="{Binding Cipher.SubTitle, Mode=OneWay}" /> Text="{Binding Cipher.SubTitle, Mode=OneWay}" />
<controls:FaLabel
<controls:FaLabel Grid.Column="1"
Grid.Column="2" Grid.Row="0"
Grid.Row="0" HorizontalOptions="Start"
HorizontalOptions="Start" VerticalOptions="Center"
VerticalOptions="Center" StyleClass="list-title-icon"
StyleClass="list-title-icon" Margin="5, 0, 0, 0"
Margin="5, 0, 0, 0" Text="&#xf1e0;"
Text="&#xf1e0;" IsVisible="{Binding Cipher.Shared, Mode=OneWay}" />
IsVisible="{Binding Cipher.Shared, Mode=OneWay}" /> <controls:FaLabel
<controls:FaLabel Grid.Column="2"
Grid.Column="3" Grid.Row="0"
Grid.Row="0" HorizontalOptions="Start"
HorizontalOptions="Start" VerticalOptions="Center"
VerticalOptions="Center" StyleClass="list-title-icon"
StyleClass="list-title-icon" Margin="5, 0, 0, 0"
Margin="5, 0, 0, 0" Text="&#xf0c6;"
Text="&#xf0c6;" IsVisible="{Binding Cipher.HasAttachments, Mode=OneWay}" />
IsVisible="{Binding Cipher.HasAttachments, Mode=OneWay}" /> </Grid>
<controls:MiButton <controls:MiButton
BackgroundColor="Green"
Grid.Row="0"
Grid.Column="2"
Text="&#xe5d3;" Text="&#xe5d3;"
StyleClass="list-row-button, list-row-button-platform, btn-disabled" StyleClass="list-row-button, list-row-button-platform, btn-disabled"
Clicked="ImageButton_Clicked" Clicked="MoreButton_Clicked"
Grid.Column="4" VerticalOptions="CenterAndExpand"
Grid.Row="0" HorizontalOptions="EndAndExpand" />
Grid.RowSpan="2" />
</Grid> </Grid>
</ViewCell> </ViewCell>

View file

@ -181,7 +181,7 @@ namespace Bit.App.Controls
return new Tuple<string, string>(icon, image); return new Tuple<string, string>(icon, image);
} }
private void ImageButton_Clicked(object sender, EventArgs e) private void MoreButton_Clicked(object sender, EventArgs e)
{ {
ButtonCommand?.Execute(Cipher); ButtonCommand?.Execute(Cipher);
} }

View file

@ -236,10 +236,6 @@
Value="0" /> Value="0" />
<Setter Property="TextColor" <Setter Property="TextColor"
Value="{StaticResource ButtonColor}" /> Value="{StaticResource ButtonColor}" />
<Setter Property="HorizontalOptions"
Value="End" />
<Setter Property="VerticalOptions"
Value="CenterAndExpand" />
</Style> </Style>
<!-- Box --> <!-- Box -->