HiImRay_Public/demo-xf-app-1a
1
0
Fork 0
Code Pull Requests Releases Activity

WIP: flyout page menu + graphics

Browse Source
This commit is contained in:
Ray 2021-08-02 22:49:48 +01:00
parent 787a71f989
commit d302425b88
18 changed files with 399 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
MobileApp1.Android/MobileApp1.Android.csproj
View File

@ -96,5 +96,20 @@
<ItemGroup>
<AndroidResource Include="Resources\drawable\splash_screen.xml" />
</ItemGroup>
<ItemGroup>
<AndroidResource Include="Resources\drawable\home.png" />
</ItemGroup>
<ItemGroup>
<AndroidResource Include="Resources\drawable\layers.png" />
</ItemGroup>
<ItemGroup>
<AndroidResource Include="Resources\drawable\help.png" />
</ItemGroup>
<ItemGroup>
<AndroidResource Include="Resources\drawable\settings.png" />
</ItemGroup>
<ItemGroup>
<AndroidResource Include="Resources\drawable\logout.png" />
</ItemGroup>
<Import Project="$(MSBuildExtensionsPath)\Xamarin\Android\Xamarin.Android.CSharp.targets" />
</Project>

91
MobileApp1.Android/Resources/Resource.designer.cs generated
View File

@ -11683,118 +11683,133 @@ namespace MobileApp1.Droid
public const int design_snackbar_background = 2131165292;
// aapt resource value: 0x7F07006D
public const int ic_mtrl_checked_circle = 2131165293;
public const int help = 2131165293;
// aapt resource value: 0x7F07006E
public const int ic_mtrl_chip_checked_black = 2131165294;
public const int home = 2131165294;
// aapt resource value: 0x7F07006F
public const int ic_mtrl_chip_checked_circle = 2131165295;
public const int ic_mtrl_checked_circle = 2131165295;
// aapt resource value: 0x7F070070
public const int ic_mtrl_chip_close_circle = 2131165296;
public const int ic_mtrl_chip_checked_black = 2131165296;
// aapt resource value: 0x7F070071
public const int material_ic_calendar_black_24dp = 2131165297;
public const int ic_mtrl_chip_checked_circle = 2131165297;
// aapt resource value: 0x7F070072
public const int material_ic_clear_black_24dp = 2131165298;
public const int ic_mtrl_chip_close_circle = 2131165298;
// aapt resource value: 0x7F070073
public const int material_ic_edit_black_24dp = 2131165299;
public const int layers = 2131165299;
// aapt resource value: 0x7F070074
public const int material_ic_keyboard_arrow_left_black_24dp = 2131165300;
public const int logout = 2131165300;
// aapt resource value: 0x7F070075
public const int material_ic_keyboard_arrow_right_black_24dp = 2131165301;
public const int material_ic_calendar_black_24dp = 2131165301;
// aapt resource value: 0x7F070076
public const int material_ic_menu_arrow_down_black_24dp = 2131165302;
public const int material_ic_clear_black_24dp = 2131165302;
// aapt resource value: 0x7F070077
public const int material_ic_menu_arrow_up_black_24dp = 2131165303;
public const int material_ic_edit_black_24dp = 2131165303;
// aapt resource value: 0x7F070078
public const int mtrl_dialog_background = 2131165304;
public const int material_ic_keyboard_arrow_left_black_24dp = 2131165304;
// aapt resource value: 0x7F070079
public const int mtrl_dropdown_arrow = 2131165305;
public const int material_ic_keyboard_arrow_right_black_24dp = 2131165305;
// aapt resource value: 0x7F07007A
public const int mtrl_ic_arrow_drop_down = 2131165306;
public const int material_ic_menu_arrow_down_black_24dp = 2131165306;
// aapt resource value: 0x7F07007B
public const int mtrl_ic_arrow_drop_up = 2131165307;
public const int material_ic_menu_arrow_up_black_24dp = 2131165307;
// aapt resource value: 0x7F07007C
public const int mtrl_ic_cancel = 2131165308;
public const int mtrl_dialog_background = 2131165308;
// aapt resource value: 0x7F07007D
public const int mtrl_ic_error = 2131165309;
public const int mtrl_dropdown_arrow = 2131165309;
// aapt resource value: 0x7F07007E
public const int mtrl_popupmenu_background = 2131165310;
public const int mtrl_ic_arrow_drop_down = 2131165310;
// aapt resource value: 0x7F07007F
public const int mtrl_popupmenu_background_dark = 2131165311;
public const int mtrl_ic_arrow_drop_up = 2131165311;
// aapt resource value: 0x7F070080
public const int mtrl_tabs_default_indicator = 2131165312;
public const int mtrl_ic_cancel = 2131165312;
// aapt resource value: 0x7F070081
public const int navigation_empty_icon = 2131165313;
public const int mtrl_ic_error = 2131165313;
// aapt resource value: 0x7F070082
public const int notification_action_background = 2131165314;
public const int mtrl_popupmenu_background = 2131165314;
// aapt resource value: 0x7F070083
public const int notification_bg = 2131165315;
public const int mtrl_popupmenu_background_dark = 2131165315;
// aapt resource value: 0x7F070084
public const int notification_bg_low = 2131165316;
public const int mtrl_tabs_default_indicator = 2131165316;
// aapt resource value: 0x7F070085
public const int notification_bg_low_normal = 2131165317;
public const int navigation_empty_icon = 2131165317;
// aapt resource value: 0x7F070086
public const int notification_bg_low_pressed = 2131165318;
public const int notification_action_background = 2131165318;
// aapt resource value: 0x7F070087
public const int notification_bg_normal = 2131165319;
public const int notification_bg = 2131165319;
// aapt resource value: 0x7F070088
public const int notification_bg_normal_pressed = 2131165320;
public const int notification_bg_low = 2131165320;
// aapt resource value: 0x7F070089
public const int notification_icon_background = 2131165321;
public const int notification_bg_low_normal = 2131165321;
// aapt resource value: 0x7F07008A
public const int notification_template_icon_bg = 2131165322;
public const int notification_bg_low_pressed = 2131165322;
// aapt resource value: 0x7F07008B
public const int notification_template_icon_low_bg = 2131165323;
public const int notification_bg_normal = 2131165323;
// aapt resource value: 0x7F07008C
public const int notification_tile_bg = 2131165324;
public const int notification_bg_normal_pressed = 2131165324;
// aapt resource value: 0x7F07008D
public const int notify_panel_notification_icon_bg = 2131165325;
public const int notification_icon_background = 2131165325;
// aapt resource value: 0x7F07008E
public const int splash_logo = 2131165326;
public const int notification_template_icon_bg = 2131165326;
// aapt resource value: 0x7F07008F
public const int splash_screen = 2131165327;
public const int notification_template_icon_low_bg = 2131165327;
// aapt resource value: 0x7F070090
public const int test_custom_background = 2131165328;
public const int notification_tile_bg = 2131165328;
// aapt resource value: 0x7F070091
public const int tooltip_frame_dark = 2131165329;
public const int notify_panel_notification_icon_bg = 2131165329;
// aapt resource value: 0x7F070092
public const int tooltip_frame_light = 2131165330;
public const int settings = 2131165330;
// aapt resource value: 0x7F070093
public const int splash_logo = 2131165331;
// aapt resource value: 0x7F070094
public const int splash_screen = 2131165332;
// aapt resource value: 0x7F070095
public const int test_custom_background = 2131165333;
// aapt resource value: 0x7F070096
public const int tooltip_frame_dark = 2131165334;
// aapt resource value: 0x7F070097
public const int tooltip_frame_light = 2131165335;
static Drawable()
{

BIN
MobileApp1.Android/Resources/drawable/help.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.5 KiB

BIN
MobileApp1.Android/Resources/drawable/home.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.8 KiB

BIN
MobileApp1.Android/Resources/drawable/layers.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

BIN
MobileApp1.Android/Resources/drawable/logout.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

BIN
MobileApp1.Android/Resources/drawable/settings.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.9 KiB

3
MobileApp1/App.xaml.cs
View File

@ -17,7 +17,8 @@ namespace MobileApp1
//MainPage = new AppShell();
MainPage = new NavigationPage(new LoginPage());
//MainPage = new NavigationPage(new LoginPage());
MainPage = new MainPage();
}
protected override void OnStart()

14
MobileApp1/MobileApp1.csproj
View File

@ -13,6 +13,9 @@
<Compile Remove="Views\ItemDetailPage.xaml.cs" />
<Compile Remove="Views\ItemsPage.xaml.cs" />
<Compile Remove="Views\LoginPage1.xaml.cs" />
<Compile Remove="Views\MainPageDetail.xaml.cs" />
<Compile Remove="Views\MainPageFlyout.xaml.cs" />
<Compile Remove="Views\MainPageFlyoutMenuItem.cs" />
<Compile Remove="Views\NewItemPage.xaml.cs" />
</ItemGroup>
@ -21,6 +24,8 @@
<EmbeddedResource Remove="Views\ItemDetailPage.xaml" />
<EmbeddedResource Remove="Views\ItemsPage.xaml" />
<EmbeddedResource Remove="Views\LoginPage1.xaml" />
<EmbeddedResource Remove="Views\MainPageDetail.xaml" />
<EmbeddedResource Remove="Views\MainPageFlyout.xaml" />
<EmbeddedResource Remove="Views\NewItemPage.xaml" />
</ItemGroup>
@ -36,6 +41,9 @@
<Compile Update="Views\Content\CompanyHeaderView.xaml.cs">
<DependentUpon>CompanyHeaderView.xaml</DependentUpon>
</Compile>
<Compile Update="Views\BlankPage.xaml.cs">
<DependentUpon>BlankPage.xaml</DependentUpon>
</Compile>
<Compile Update="Views\PasswordResetPage.xaml.cs">
<DependentUpon>PasswordResetPage.xaml</DependentUpon>
</Compile>
@ -54,11 +62,17 @@
</ItemGroup>
<ItemGroup>
<EmbeddedResource Update="Views\FlyoutMenuPage.xaml">
<Generator>MSBuild:UpdateDesignTimeXaml</Generator>
</EmbeddedResource>
<EmbeddedResource Update="Views\LoginPage.xaml">
<Generator>MSBuild:UpdateDesignTimeXaml</Generator>
</EmbeddedResource>
<EmbeddedResource Update="Views\Content\Login\LoginView.xaml">
<Generator>MSBuild:UpdateDesignTimeXaml</Generator>
</EmbeddedResource>
<EmbeddedResource Update="Views\MainPage.xaml">
<Generator>MSBuild:UpdateDesignTimeXaml</Generator>
</EmbeddedResource>
</ItemGroup>
</Project>

13
MobileApp1/Models/FlyoutPageItem.cs Normal file
View File

@ -0,0 +1,13 @@
using System;
namespace MobileApp1.Models
{
public class FlyoutPageItem
{
public string Title { get; set; }
public string Icon { get; set; }
public Type TargetType { get; set; }
}
}

22
MobileApp1/Views/BlankPage.xaml Normal file
View File

@ -0,0 +1,22 @@
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="MobileApp1.Views.BlankPage"
xmlns:views="clr-namespace:MobileApp1.Views"
Title="Blank">
<ContentPage.Content>
<StackLayout Margin="20">
<views:CompanyHeaderView />
<StackLayout HorizontalOptions="Fill">
<ScrollView>
<StackLayout>
<Label x:Name="label1" Text="" Margin="0, 0, 0, 20" FontSize="Body" />
</StackLayout>
</ScrollView>
</StackLayout>
</StackLayout>
</ContentPage.Content>
</ContentPage>

16
MobileApp1/Views/BlankPage.xaml.cs Normal file
View File

@ -0,0 +1,16 @@
using System;
using Xamarin.Forms;
namespace MobileApp1.Views
{
public partial class BlankPage : ContentPage
{
public BlankPage()
{
InitializeComponent();
label1.Text = Guid.NewGuid().ToString();
}
}
}

39
MobileApp1/Views/FlyoutMenuPage.xaml Normal file
View File

@ -0,0 +1,39 @@
<?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:models="clr-namespace:MobileApp1.Models"
xmlns:views="clr-namespace:MobileApp1.Views"
x:Class="MobileApp1.Views.FlyoutMenuPage"
Padding="0, 20, 0, 0"
Title="Menu">
<StackLayout>
<Image Source="company_logo.png" WidthRequest="{OnPlatform iOS=180, Android=180}" HorizontalOptions="Center" Margin="0, 0, 0, 20" />
<ListView x:Name="listView" x:FieldModifier="Public">
<ListView.ItemsSource>
<x:Array Type="{x:Type models:FlyoutPageItem}">
<models:FlyoutPageItem Title="Home" Icon="home.png" TargetType="{x:Type views:BlankPage}" />
<models:FlyoutPageItem Title="My Stuff" Icon="layers.png" TargetType="{x:Type views:BlankPage}" />
<models:FlyoutPageItem Title="Settings" Icon="settings.png" TargetType="{x:Type views:BlankPage}" />
<models:FlyoutPageItem Title="About" Icon="help.png" TargetType="{x:Type views:BlankPage}" />
<models:FlyoutPageItem Title="Logout" Icon="logout.png" TargetType="{x:Type views:BlankPage}" />
</x:Array>
</ListView.ItemsSource>
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<Grid Padding="5, 10">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="30"/>
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Image Source="{Binding Icon}" />
<Label Grid.Column="1" Text="{Binding Title}" />
</Grid>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackLayout>
</ContentPage>

14
MobileApp1/Views/FlyoutMenuPage.xaml.cs Normal file
View File

@ -0,0 +1,14 @@
using Xamarin.Forms;
using Xamarin.Forms.Xaml;
namespace MobileApp1.Views
{
[XamlCompilation(XamlCompilationOptions.Compile)]
public partial class FlyoutMenuPage : ContentPage
{
public FlyoutMenuPage()
{
InitializeComponent();
}
}
}

15
MobileApp1/Views/MainPage.xaml Normal file
View File

@ -0,0 +1,15 @@
<?xml version="1.0" encoding="utf-8" ?>
<FlyoutPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:views="clr-namespace:MobileApp1.Views"
x:Class="MobileApp1.Views.MainPage">
<FlyoutPage.Flyout>
<views:FlyoutMenuPage x:Name="flyoutPage" />
</FlyoutPage.Flyout>
<FlyoutPage.Detail>
<NavigationPage>
<x:Arguments>
<views:BlankPage />
</x:Arguments>
</NavigationPage>
</FlyoutPage.Detail>
</FlyoutPage>

47
MobileApp1/Views/MainPage.xaml.cs Normal file
View File

@ -0,0 +1,47 @@
using MobileApp1.Models;
using System;
using Xamarin.Forms;
using Xamarin.Forms.Xaml;
namespace MobileApp1.Views
{
[XamlCompilation(XamlCompilationOptions.Compile)]
public partial class MainPage : FlyoutPage
{
public MainPage()
{
InitializeComponent();
flyoutPage.listView.ItemSelected += listView1_OnItemSelected;
}
//private void ListView_ItemSelected(object sender, SelectedItemChangedEventArgs e)
//{
// var item = e.SelectedItem as MainPageFlyoutMenuItem;
// if (item == null)
// return;
// var page = (Page)Activator.CreateInstance(item.TargetType);
// page.Title = item.Title;
// Detail = new NavigationPage(page);
// IsPresented = false;
// FlyoutPage.ListView.SelectedItem = null;
//}
private void listView1_OnItemSelected(object sender, SelectedItemChangedEventArgs e)
{
var item = e.SelectedItem as FlyoutPageItem;
if (item == null)
{
return;
}
Detail = new NavigationPage((Page)Activator.CreateInstance(item.TargetType));
flyoutPage.listView.SelectedItem = null;
IsPresented = false;
}
}
}

149
Resources/graphics-icons.svg Normal file
View File

@ -0,0 +1,149 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
inkscape:version="1.0 (4035a4fb49, 2020-05-01)"
sodipodi:docname="graphics-icons.svg"
id="svg849"
version="1.1"
class="feather feather-home"
stroke-linejoin="round"
stroke-linecap="round"
stroke-width="2"
stroke="currentColor"
fill="none"
viewBox="0 0 24 24"
height="24"
width="24">
<metadata
id="metadata855">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<defs
id="defs853" />
<sodipodi:namedview
inkscape:current-layer="svg849"
inkscape:window-maximized="1"
inkscape:window-y="845"
inkscape:window-x="1072"
inkscape:cy="103.28782"
inkscape:cx="39.714689"
inkscape:zoom="3.0457152"
showgrid="false"
id="namedview851"
inkscape:window-height="1017"
inkscape:window-width="1920"
inkscape:pageshadow="2"
inkscape:pageopacity="0"
guidetolerance="10"
gridtolerance="10"
objecttolerance="10"
borderopacity="1"
bordercolor="#666666"
pagecolor="#ffffff" />
<g
inkscape:export-ydpi="150"
inkscape:export-xdpi="150"
inkscape:export-filename="L:\gitlab-hiimray\Hi-Im-Ray-Public\demo-xf-app-1a\MobileApp1.Android\Resources\drawable\home.png"
transform="matrix(3.7146944,0,0,3.7146944,-198.4875,-71.335761)"
id="g1828">
<path
d="m 3,9 9,-7 9,7 v 11 a 2,2 0 0 1 -2,2 H 5 A 2,2 0 0 1 3,20 Z"
id="path845" />
<polyline
points="9 22 9 12 15 12 15 22"
id="polyline847" />
</g>
<g
inkscape:export-ydpi="150"
inkscape:export-xdpi="150"
inkscape:export-filename="L:\gitlab-hiimray\Hi-Im-Ray-Public\demo-xf-app-1a\MobileApp1.Android\Resources\drawable\layers.png"
transform="matrix(3.7236475,0,0,3.7236475,-181.98962,-72.376954)"
id="g1834">
<g
style="fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round"
id="g874"
transform="translate(25.67588,-0.34428102)">
<polygon
id="polygon857"
points="2,7 12,12 22,7 12,2 " />
<polyline
id="polyline859"
points="2 17 12 22 22 17" />
<polyline
id="polyline861"
points="2 12 12 17 22 12" />
</g>
</g>
<g
inkscape:export-ydpi="150"
inkscape:export-xdpi="150"
inkscape:export-filename="L:\gitlab-hiimray\Hi-Im-Ray-Public\demo-xf-app-1a\MobileApp1.Android\Resources\drawable\settings.png"
transform="matrix(3.4009139,0,0,3.4009139,-186.14433,46.878093)"
id="g1866"
style="fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round">
<circle
cx="12"
cy="12"
r="3"
id="circle1852" />
<path
d="m 19.4,15 a 1.65,1.65 0 0 0 0.33,1.82 l 0.06,0.06 a 2,2 0 0 1 0,2.83 2,2 0 0 1 -2.83,0 L 16.9,19.65 a 1.65,1.65 0 0 0 -1.82,-0.33 1.65,1.65 0 0 0 -1,1.51 V 21 a 2,2 0 0 1 -2,2 2,2 0 0 1 -2,-2 V 20.91 A 1.65,1.65 0 0 0 9,19.4 1.65,1.65 0 0 0 7.18,19.73 l -0.06,0.06 a 2,2 0 0 1 -2.83,0 2,2 0 0 1 0,-2.83 L 4.35,16.9 a 1.65,1.65 0 0 0 0.33,-1.82 1.65,1.65 0 0 0 -1.51,-1 H 3 a 2,2 0 0 1 -2,-2 2,2 0 0 1 2,-2 H 3.09 A 1.65,1.65 0 0 0 4.6,9 1.65,1.65 0 0 0 4.27,7.18 L 4.21,7.12 a 2,2 0 0 1 0,-2.83 2,2 0 0 1 2.83,0 L 7.1,4.35 A 1.65,1.65 0 0 0 8.92,4.68 H 9 A 1.65,1.65 0 0 0 10,3.17 V 3 a 2,2 0 0 1 2,-2 2,2 0 0 1 2,2 v 0.09 a 1.65,1.65 0 0 0 1,1.51 1.65,1.65 0 0 0 1.82,-0.33 l 0.06,-0.06 a 2,2 0 0 1 2.83,0 2,2 0 0 1 0,2.83 L 19.65,7.1 A 1.65,1.65 0 0 0 19.32,8.92 V 9 a 1.65,1.65 0 0 0 1.51,1 H 21 a 2,2 0 0 1 2,2 2,2 0 0 1 -2,2 h -0.09 a 1.65,1.65 0 0 0 -1.51,1 z"
id="path1854" />
</g>
<g
inkscape:export-ydpi="150"
inkscape:export-xdpi="150"
inkscape:export-filename="L:\gitlab-hiimray\Hi-Im-Ray-Public\demo-xf-app-1a\MobileApp1.Android\Resources\drawable\help.png"
transform="matrix(3.7226558,0,0,3.7226558,-74.621084,44.247114)"
id="g1901"
style="fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round">
<circle
cx="12"
cy="12"
r="10"
id="circle1884" />
<path
d="m 9.09,9 a 3,3 0 0 1 5.83,1 c 0,2 -3,3 -3,3"
id="path1886" />
<line
x1="12"
y1="17"
x2="12.01"
y2="17"
id="line1888" />
</g>
<g
inkscape:export-ydpi="150"
inkscape:export-xdpi="150"
inkscape:export-filename="L:\gitlab-hiimray\Hi-Im-Ray-Public\demo-xf-app-1a\MobileApp1.Android\Resources\drawable\logout.png"
transform="matrix(4.0877872,0,0,4.0877872,59.74235,42.046217)"
id="g1920"
style="fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round">
<path
d="M 9,21 H 5 A 2,2 0 0 1 3,19 V 5 A 2,2 0 0 1 5,3 h 4"
id="path1903" />
<polyline
points="16 17 21 12 16 7"
id="polyline1905" />
<line
x1="21"
y1="12"
x2="9"
y2="12"
id="line1907" />
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 5.4 KiB

0
Resources/graphics.svg → Resources/graphics-logos.svg
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 92 KiB

After

Width:  |  Height:  |  Size: 92 KiB