some listview styling for iOS

This commit is contained in:
Kyle Spearrin 2019-06-20 16:02:39 -04:00
parent 223ec180fc
commit dc91624597
7 changed files with 107 additions and 18 deletions

View file

@ -76,7 +76,7 @@
IsVisible="{Binding Cipher.HasAttachments, Mode=OneWay}" /> IsVisible="{Binding Cipher.HasAttachments, Mode=OneWay}" />
<controls:MiButton <controls:MiButton
Text="&#xe5d4;" 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="ImageButton_Clicked"
Grid.Column="4" Grid.Column="4"

View file

@ -47,7 +47,8 @@
<ListView <ListView
ItemsSource="{Binding GroupedItems}" ItemsSource="{Binding GroupedItems}"
VerticalOptions="FillAndExpand" VerticalOptions="FillAndExpand"
HasUnevenRows="true" HasUnevenRows="True"
RowHeight="-1"
ItemTemplate="{StaticResource listItemDataTemplateSelector}" ItemTemplate="{StaticResource listItemDataTemplateSelector}"
IsGroupingEnabled="True" IsGroupingEnabled="True"
ItemSelected="RowSelected" ItemSelected="RowSelected"
@ -56,14 +57,16 @@
<ListView.GroupHeaderTemplate> <ListView.GroupHeaderTemplate>
<DataTemplate x:DataType="pages:SettingsPageListGroup"> <DataTemplate x:DataType="pages:SettingsPageListGroup">
<ViewCell> <ViewCell>
<StackLayout Padding="0" Spacing="0"> <StackLayout Padding="0" Spacing="0" VerticalOptions="FillAndExpand">
<BoxView StyleClass="list-section-separator" <BoxView
IsVisible="{Binding First, Converter={StaticResource inverseBool}}" /> StyleClass="list-section-separator-top, list-section-separator-top-platform"
<StackLayout StyleClass="list-row-header"> IsVisible="{Binding First, Converter={StaticResource inverseBool}}" />
<StackLayout StyleClass="list-row-header, list-row-header-platform">
<Label <Label
Text="{Binding Name}" Text="{Binding Name}"
StyleClass="list-header, list-header-platform" /> StyleClass="list-header, list-header-platform" />
</StackLayout> </StackLayout>
<BoxView StyleClass="list-section-separator-bottom, list-section-separator-bottom-platform" />
</StackLayout> </StackLayout>
</ViewCell> </ViewCell>
</DataTemplate> </DataTemplate>

View file

@ -95,9 +95,10 @@
IsVisible="{Binding ShowList}" IsVisible="{Binding ShowList}"
ItemsSource="{Binding GroupedItems}" ItemsSource="{Binding GroupedItems}"
VerticalOptions="FillAndExpand" VerticalOptions="FillAndExpand"
HasUnevenRows="true" HasUnevenRows="True"
RowHeight="-1"
RefreshCommand="{Binding RefreshCommand}" RefreshCommand="{Binding RefreshCommand}"
IsPullToRefreshEnabled="true" IsPullToRefreshEnabled="True"
IsRefreshing="{Binding Refreshing}" IsRefreshing="{Binding Refreshing}"
ItemTemplate="{StaticResource listItemDataTemplateSelector}" ItemTemplate="{StaticResource listItemDataTemplateSelector}"
IsGroupingEnabled="True" IsGroupingEnabled="True"
@ -109,11 +110,12 @@
<ListView.GroupHeaderTemplate> <ListView.GroupHeaderTemplate>
<DataTemplate x:DataType="pages:GroupingsPageListGroup"> <DataTemplate x:DataType="pages:GroupingsPageListGroup">
<ViewCell> <ViewCell BindingContextChanged="HeaderBindingContextChanged">
<StackLayout Spacing="0" Padding="0"> <StackLayout Spacing="0" Padding="0" VerticalOptions="FillAndExpand">
<BoxView StyleClass="list-section-separator" <BoxView
IsVisible="{Binding First, Converter={StaticResource inverseBool}}" /> StyleClass="list-section-separator-top, list-section-separator-top-platform"
<StackLayout StyleClass="list-row-header"> IsVisible="{Binding First, Converter={StaticResource inverseBool}}" />
<StackLayout StyleClass="list-row-header, list-row-header-platform">
<Label <Label
Text="{Binding Name}" Text="{Binding Name}"
StyleClass="list-header, list-header-platform" /> StyleClass="list-header, list-header-platform" />
@ -121,6 +123,7 @@
Text="{Binding ItemCount}" Text="{Binding ItemCount}"
StyleClass="list-header-sub" /> StyleClass="list-header-sub" />
</StackLayout> </StackLayout>
<BoxView StyleClass="list-section-separator-bottom, list-section-separator-bottom-platform" />
</StackLayout> </StackLayout>
</ViewCell> </ViewCell>
</DataTemplate> </DataTemplate>

View file

@ -245,5 +245,13 @@ namespace Bit.App.Pages
await Navigation.PushModalAsync(new NavigationPage(page)); await Navigation.PushModalAsync(new NavigationPage(page));
} }
} }
private void HeaderBindingContextChanged(object sender, EventArgs e)
{
if(Device.RuntimePlatform == Device.iOS && sender is ViewCell cell)
{
// cell.Height = 50;
}
}
} }
} }

View file

@ -52,6 +52,13 @@
<Setter Property="SeparatorColor" <Setter Property="SeparatorColor"
Value="Transparent" /> Value="Transparent" />
</Style> </Style>
<Style TargetType="StackLayout"
Class="list-row-header-platform">
<Setter Property="Padding"
Value="10, 12" />
<Setter Property="VerticalOptions"
Value="CenterAndExpand" />
</Style>
<Style TargetType="Label" <Style TargetType="Label"
Class="list-header-platform"> Class="list-header-platform">
<Setter Property="TextColor" <Setter Property="TextColor"
@ -61,6 +68,18 @@
<Setter Property="FontAttributes" <Setter Property="FontAttributes"
Value="Bold" /> Value="Bold" />
</Style> </Style>
<Style TargetType="BoxView"
Class="list-section-separator-top-platform">
<Setter Property="Color"
Value="{StaticResource ListItemBorderColor}" />
</Style>
<Style TargetType="BoxView"
Class="list-section-separator-bottom-platform">
<Setter Property="Color"
Value="Transparent" />
<Setter Property="IsVisible"
Value="False" />
</Style>
<Style TargetType="StackLayout" <Style TargetType="StackLayout"
Class="list-row-platform"> Class="list-row-platform">
</Style> </Style>

View file

@ -141,8 +141,6 @@
</Style> </Style>
<Style TargetType="StackLayout" <Style TargetType="StackLayout"
Class="list-row-header"> Class="list-row-header">
<Setter Property="Padding"
Value="10, 12" />
<Setter Property="Orientation" <Setter Property="Orientation"
Value="Horizontal" /> Value="Horizontal" />
</Style> </Style>
@ -181,11 +179,14 @@
Value="2, 5, 0, 5" /> Value="2, 5, 0, 5" />
</Style> </Style>
<Style TargetType="BoxView" <Style TargetType="BoxView"
Class="list-section-separator"> Class="list-section-separator-top">
<Setter Property="HeightRequest"
Value="1" />
</Style>
<Style TargetType="BoxView"
Class="list-section-separator-bottom">
<Setter Property="HeightRequest" <Setter Property="HeightRequest"
Value="1" /> Value="1" />
<Setter Property="Color"
Value="{StaticResource ListItemBorderColor}" />
</Style> </Style>
<Style TargetType="Label" <Style TargetType="Label"
Class="list-title"> Class="list-title">

View file

@ -12,4 +12,59 @@
<Setter Property="PlaceholderColor" <Setter Property="PlaceholderColor"
Value="{StaticResource InputPlaceholderColor}" /> Value="{StaticResource InputPlaceholderColor}" />
</Style> </Style>
<!-- List -->
<Style TargetType="ListView"
Class="list-platform"
ApplyToDerivedTypes="True">
<Setter Property="SeparatorColor"
Value="{StaticResource ListItemBorderColor}" />
</Style>
<Style TargetType="StackLayout"
Class="list-row-header-platform">
<Setter Property="Padding"
Value="10, 0, 10, 5" />
<Setter Property="VerticalOptions"
Value="EndAndExpand" />
</Style>
<Style TargetType="Label"
Class="list-header-platform">
<Setter Property="TextColor"
Value="{StaticResource ListHeaderTextColor}" />
<Setter Property="FontSize"
Value="Small" />
</Style>
<Style TargetType="BoxView"
Class="list-section-separator-top-platform">
<Setter Property="Color"
Value="{StaticResource ListItemBorderColor}" />
</Style>
<Style TargetType="BoxView"
Class="list-section-separator-bottom-platform">
<Setter Property="Color"
Value="{StaticResource ListItemBorderColor}" />
<Setter Property="Margin"
Value="0, 0, 0, -1" />
</Style>
<Style TargetType="StackLayout"
Class="list-row-platform">
</Style>
<Style TargetType="Grid"
Class="list-row-platform">
</Style>
<Style TargetType="Label"
Class="list-icon-platform"
ApplyToDerivedTypes="True">
<Setter Property="FontSize"
Value="10" />
</Style>
<Style TargetType="Button"
ApplyToDerivedTypes="True"
Class="list-row-button-platform">
<Setter Property="WidthRequest"
Value="37" />
<Setter Property="FontSize"
Value="25" />
</Style>
</ResourceDictionary> </ResourceDictionary>