Skip to content

Instantly share code, notes, and snippets.

@LanceMcCarthy
Created June 28, 2016 14:51
Show Gist options
  • Save LanceMcCarthy/b2705293105fc5ff9dc2f8bd3a75aa97 to your computer and use it in GitHub Desktop.
Save LanceMcCarthy/b2705293105fc5ff9dc2f8bd3a75aa97 to your computer and use it in GitHub Desktop.
This is a straight copy/paste of a Xamarin Forms view where I am using the RadSideDrawer
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:Hacked.Forms;assembly=Hacked.Forms"
x:Class="Hacked.Forms.Views.MainPage"
xmlns:telerik="clr-namespace:Telerik.XamarinForms.DataControls;assembly=Telerik.XamarinForms.DataControls"
xmlns:listView="clr-namespace:Telerik.XamarinForms.DataControls.ListView;assembly=Telerik.XamarinForms.DataControls"
xmlns:primitives="clr-namespace:Telerik.XamarinForms.Primitives;assembly=Telerik.XamarinForms.Primitives"
xmlns:common="clr-namespace:Hacked.Forms.Common;assembly=Hacked.Forms"
xmlns:converters="clr-namespace:Hacked.Forms.Converters;assembly=Hacked.Forms"
BindingContext="{Binding Source={x:Static local:App.ViewModel}}">
<ContentPage.Padding>
<common:OnTargetPlatform x:TypeArguments="Thickness"
iOS="0,20,0,0"
Android="0,0,0,0"
WinPhone="0,0,0,0"
Windows="0,0,0,0" />
</ContentPage.Padding>
<ContentPage.BackgroundColor>
<common:OnTargetPlatform x:TypeArguments="Color"
iOS="White"
Android="#676767"
WinPhone="White"
Windows="White" />
</ContentPage.BackgroundColor>
<ContentPage.Resources>
<ResourceDictionary>
<converters:DataClassesToStringConverter x:Key="DataClassesToStringConverter"/>
<converters:InvertBoolConverter x:Key="InvertBoolConverter" />
<converters:DisplayDateConverter x:Key="DisplayDateConverter" />
<converters:StringToUriConverter x:Key="StringToUriConverter" />
<converters:NullToBoolConverter x:Key="NullToBoolConverter" />
</ResourceDictionary>
</ContentPage.Resources>
<Grid >
<primitives:RadSideDrawer x:Name="Drawer"
DrawerTransitionDuration="0.2"
DrawerTransitionType="Push">
<primitives:RadSideDrawer.DrawerContent>
<Grid>
<Grid.BackgroundColor>
<common:OnTargetPlatform x:TypeArguments="Color"
iOS="#EAEAEA"
Android="#676767"
WinPhone="#EAEAEA"
Windows="#EAEAEA" />
</Grid.BackgroundColor>
<Grid.RowDefinitions>
<RowDefinition Height="50"/>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Grid x:Name="DrawerHeaderGrid"
VerticalOptions="End">
<Label Text="Monitored Accounts"
HorizontalOptions="Center"
VerticalOptions="Center"/>
</Grid>
<telerik:RadListView x:Name="AccountsListView"
ItemsSource="{Binding Accounts}"
SelectedItem="{Binding SelectedAccount, Mode=TwoWay}"
SelectionChanged="AccountsListView_OnSelectionChanged"
IsItemSwipeEnabled="True"
ItemSwipeCompleted="AccountsListView_OnItemSwipeCompleted"
IsPullToRefreshEnabled="True"
RefreshRequested="AccountsListView_OnRefreshRequested"
Grid.Row="1">
<telerik:RadListView.ItemTemplate>
<DataTemplate>
<listView:ListViewTemplateCell>
<listView:ListViewTemplateCell.View>
<Grid Padding="16, 0, 16, 0">
<StackLayout Orientation="Horizontal">
<!--<Button Text="X"
BackgroundColor="Red"
TextColor="Black"
CommandParameter="{Binding}"
FontSize="Small"
HorizontalOptions="End"
Clicked="RemoveAccountButton_OnClicked"/>-->
<Label Text="{Binding Address}"
FontSize="Medium"
HorizontalOptions="Start"
VerticalOptions="Center"/>
</StackLayout>
</Grid>
</listView:ListViewTemplateCell.View>
</listView:ListViewTemplateCell>
</DataTemplate>
</telerik:RadListView.ItemTemplate>
<telerik:RadListView.ItemSwipeContentTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="100"/>
<ColumnDefinition/>
<ColumnDefinition Width="100"/>
</Grid.ColumnDefinitions>
<Button Text="refresh"
TextColor="White"
BackgroundColor="#00BF32"
Clicked="RefreshSwipeButton_Clicked"/>
<Button Text="delete"
TextColor="White"
BackgroundColor="#CE0005"
Clicked="DeleteSwipeButton_Clicked"
Grid.Column="2"/>
</Grid>
</DataTemplate>
</telerik:RadListView.ItemSwipeContentTemplate>
<telerik:RadListView.ItemStyle>
<listView:ListViewItemStyle BackgroundColor="Transparent" BorderLocation="None"/>
</telerik:RadListView.ItemStyle>
<telerik:RadListView.SelectedItemStyle>
<listView:ListViewItemStyle BackgroundColor="#E5EDF3" BorderWidth="3" BorderLocation="Bottom"/>
</telerik:RadListView.SelectedItemStyle>
<telerik:RadListView.PressedItemStyle>
<listView:ListViewItemStyle BackgroundColor="#C1C1C1" BorderColor="#FF692F" BorderWidth="3" BorderLocation="Bottom"/>
</telerik:RadListView.PressedItemStyle>
</telerik:RadListView>
<Grid x:Name="DrawerBaseGrid"
Grid.Row="2">
<StackLayout>
<Frame x:Name="SwipeTip" IsVisible="False" HasShadow="True" Padding="10,10">
<Label Text="Tip: Swipe an account for more actions" FontSize="Small"/>
</Frame>
<Frame x:Name="AccountRefreshTip" IsVisible="False" HasShadow="True" Padding="10,10">
<Label Text="Tip: Pull to refresh all accounts" FontSize="Small"/>
</Frame>
<Button x:Name="AddAccountModalButton"
Text="add an account"
HorizontalOptions="Center"
VerticalOptions="Center"
Clicked="AddAccountModalButton_OnClicked"/>
<Button x:Name="BackupAndRestoreButton"
Text="backup and restore"
Clicked="BackupAccountsButton_OnClick"/>
<Button x:Name="AboutButton"
Text="about | contact us | review"
Clicked="AboutButton_OnClicked"/>
</StackLayout>
</Grid>
</Grid>
</primitives:RadSideDrawer.DrawerContent>
<primitives:RadSideDrawer.MainContent>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="50"/>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Grid x:Name="HeaderGrid"
HeightRequest="50">
<Button x:Name="MainBurgerButton"
Clicked="BurgerButton_OnClicked"
HorizontalOptions="Start"
VerticalOptions="Start"
Grid.Column="0">
</Button>
<Label Text="{Binding SelectedAccount.Address}"
LineBreakMode="TailTruncation"
VerticalOptions="Center"
HorizontalOptions="Center"/>
</Grid>
<Label Text="you have no monitored accounts"
IsVisible="{Binding HasAccounts, Converter={StaticResource InvertBoolConverter}}"
HorizontalOptions="Center"
VerticalOptions="Center"
Grid.Row="1"/>
<telerik:RadListView x:Name="BreachesListView"
ItemsSource="{Binding SelectedAccount.Breaches}"
SelectedItem="{Binding SelectedAccount, Mode=TwoWay}"
IsPullToRefreshEnabled="True"
RefreshRequested="BreachesListView_OnRefreshRequested"
Grid.Row="1">
<telerik:RadListView.ItemTemplate>
<DataTemplate>
<listView:ListViewTemplateCell>
<listView:ListViewTemplateCell.View>
<Grid Padding="16, 0, 16, 10">
<StackLayout VerticalOptions="Center">
<StackLayout Orientation="Horizontal">
<Label Text="{Binding Name}" Style="{DynamicResource TitleStyle}"/>
<Label Text=" - Breached on:" />
<Label Text="{Binding BreachDate}" />
</StackLayout>
<StackLayout Orientation="Horizontal">
<Label Text="Accounts breached:"/>
<Label Text="{Binding PwnCount}" />
</StackLayout>
<!--<StackLayout Orientation="Horizontal">
<Button Command="{Binding DetailsPageCommand}"
CommandParameter="{Binding}"
VerticalOptions="Center"
HorizontalOptions="Start">
<Label Text="i"
FontSize="24" />
<Button.HeightRequest>
<OnPlatform x:TypeArguments="x:Double"
iOS="50"
Android="50"
WinPhone="100" />
</Button.HeightRequest>
</Button>
</StackLayout>
<Button Text="{Binding Domain, Converter={StaticResource StringToUriConverter}}"
Content="{Binding Domain}"
Margin="0,-5,0,-5" />-->
<!--<Label Text="{Binding DataClasses, Converter={StaticResource DataClassesToStringConverter}}"
LineBreakMode="WordWrap"/>-->
</StackLayout>
</Grid>
</listView:ListViewTemplateCell.View>
</listView:ListViewTemplateCell>
</DataTemplate>
</telerik:RadListView.ItemTemplate>
</telerik:RadListView>
<!--<Frame x:Name="AddNewAccountTip" HasShadow="True" Grid.Row="">
<StackLayout>
<Label Text="Welcome!" FontSize="Large"/>
<Label Text="To get started, you'll want to add an account, tap the menu button above and then click 'add account'." FontSize="Medium"/>
</StackLayout>
</Frame>-->
</Grid>
</primitives:RadSideDrawer.MainContent>
</primitives:RadSideDrawer>
<Grid x:Name="BusyOverlayGrid"
IsVisible="{Binding IsBusy}"
VerticalOptions="FillAndExpand"
HorizontalOptions="FillAndExpand">
<StackLayout VerticalOptions="CenterAndExpand">
<ActivityIndicator x:Name="BusyIndicator" />
<Label x:Name="BusyMessageLabel" />
</StackLayout>
</Grid>
</Grid>
</ContentPage>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment