Add champion detail page and addedit page

main
DJYohann 2 years ago
parent 9276edf20a
commit 0ec83e2813

@ -70,7 +70,7 @@
<BundleResource Include="Resources\Images\lol_logo.png" />
</ItemGroup>
<ItemGroup>
<ProjectReference Include="..\ViewModel\ViewModel.csproj" />
<ProjectReference Include="..\StubLib\StubLib.csproj" />
<ProjectReference Include="..\ViewModel\ViewModel.csproj" />
</ItemGroup>
</Project>

@ -0,0 +1,26 @@
using System;
using System.Globalization;
namespace App.Converters
{
public class Base64ToImage : IValueConverter
{
public Base64ToImage()
{
}
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
var bytes = System.Convert.FromBase64String(value as string);
MemoryStream imageDecode = new MemoryStream(bytes);
return ImageSource.FromStream(() => imageDecode);
}
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
{
throw new NotImplementedException();
}
}
}

@ -20,10 +20,7 @@ public static class MauiProgram
})
.Services.AddSingleton<IDataManager, StubData>()
.AddSingleton<ChampionManagerVM>()
.AddSingleton<ChampionsListPage>()
.AddTransient<ChampionVM>()
.AddTransient<ChampionDetailPage>();
.AddSingleton<ChampionsListPage>();
#if DEBUG
builder.Logging.AddDebug();

@ -2,16 +2,47 @@
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="App.Pages.ChampionAddEditPage"
Title="Add Champion">
<ContentPage.ToolbarItems>
<ToolbarItem Text="Edit"/>
xmlns:converters="clr-namespace:App.Converters"
Title="Add Champion"
BackgroundColor="Black">
<ContentPage.Resources>
<converters:Base64ToImage x:Key="Base64ToImageConv"/>
</ContentPage.ToolbarItems>
<Style TargetType="Label">
<Setter Property="TextColor" Value="{StaticResource Primary}"/>
</Style>
<Style TargetType="Entry">
<Setter Property="ClearButtonVisibility" Value="WhileEditing"/>
<Setter Property="TextColor" Value="{StaticResource Black}"/>
<Setter Property="BackgroundColor" Value="{StaticResource Primary}"/>
<Setter Property="PlaceholderColor" Value="{StaticResource Gray500}"/>
</Style>
</ContentPage.Resources>
<VerticalStackLayout>
<Label
Text="Welcome to .NET MAUI!"
VerticalOptions="Center"
HorizontalOptions="Center" />
<ScrollView>
<StackLayout Padding="20,0,0,0" Orientation="Vertical">
<StackLayout Orientation="Horizontal" VerticalOptions="CenterAndExpand">
<Label Text="Name"/>
<Entry Placeholder="Champion name"/>
</StackLayout>
<StackLayout Orientation="Horizontal" VerticalOptions="CenterAndExpand">
<Label Text="Icon"/>
</StackLayout>
<StackLayout Orientation="Horizontal" VerticalOptions="CenterAndExpand">
<Label Text="Image"/>
</StackLayout>
<StackLayout Orientation="Horizontal" VerticalOptions="CenterAndExpand">
<Label Text="Bio"/>
<Entry/>
</StackLayout>
</StackLayout>
</ScrollView>
</VerticalStackLayout>
</ContentPage>

@ -1,12 +1,55 @@
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:converters="clr-namespace:App.Converters"
x:Class="App.Pages.ChampionDetailPage"
Title="Champion Page">
<VerticalStackLayout>
<Label
Text="{Binding Name}"
VerticalOptions="Center"
HorizontalOptions="Center" />
</VerticalStackLayout>
Title="Champion Page"
BackgroundColor="Black">
<ContentPage.ToolbarItems>
<ToolbarItem Text="Edit" Clicked="ToolbarItem_Clicked"/>
</ContentPage.ToolbarItems>
<ContentPage.Resources>
<converters:Base64ToImage x:Key="Base64ToImageConv"/>
<Style TargetType="Label">
<Setter Property="TextColor" Value="{StaticResource Primary}"/>
</Style>
</ContentPage.Resources>
<ScrollView>
<StackLayout Orientation="Vertical">
<Image Source="{Binding Path=Image, Converter={StaticResource Base64ToImageConv}}"/>
<StackLayout Orientation="Horizontal" Padding="0,0,0,20">
<Label Text="{Binding Name}"
HorizontalOptions="Start"
FontSize="Title"/>
<Image HorizontalOptions="End"/>
</StackLayout>
<Label Text="{Binding Bio}"/>
<Label Text="Characteristics"
FontSize="Title"
Padding="0,0,0,20"/>
<CollectionView ItemsSource="{Binding Characteristics}"
ItemsLayout="VerticalGrid, 3">
<CollectionView.ItemTemplate>
<DataTemplate>
<Border Margin="10" Stroke="{StaticResource Primary}" StrokeThickness="3">
<StackLayout Orientation="Vertical" VerticalOptions="Center">
<Label HorizontalOptions="Center" Text="{Binding Key}"/>
<Label HorizontalOptions="Center" Text="{Binding Value}"/>
</StackLayout>
</Border>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
</StackLayout>
</ScrollView>
</ContentPage>

@ -4,11 +4,17 @@ namespace App.Pages;
public partial class ChampionDetailPage : ContentPage
{
//public ChampionVM ChampionVM { get; private set; }
public ChampionVM ChampionVM { get; private set; }
public ChampionDetailPage(ChampionVM championVM)
{
InitializeComponent();
BindingContext = championVM;
ChampionVM = championVM;
InitializeComponent();
BindingContext = ChampionVM;
}
async void ToolbarItem_Clicked(System.Object sender, System.EventArgs e)
{
await Navigation.PushAsync(new ChampionAddEditPage());
}
}

@ -1,20 +1,70 @@
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:converters="clr-namespace:App.Converters"
x:Class="App.Pages.ChampionsListPage"
Title="Champions">
<ContentPage.ToolbarItems>
<ToolbarItem Text="Add" Clicked="AddClicked"/>
</ContentPage.ToolbarItems>
<ListView ItemsSource="{Binding ChampionVMs}" ItemSelected="ListView_ItemSelected">
<ListView.ItemTemplate>
<DataTemplate>
<TextCell
Text="{Binding Name}"
Detail="{Binding Bio}">
</TextCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
<ContentPage.Resources>
<converters:Base64ToImage x:Key="Base64ToImageConv"/>
<Style TargetType="Button">
<Setter Property="WidthRequest">40</Setter>
<Setter Property="HeightRequest">20</Setter>
</Style>
</ContentPage.Resources>
<Grid>
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<ListView Grid.Row="0"
ItemsSource="{Binding ChampionVMs}"
ItemSelected="ListView_ItemSelected"
SelectionMode="Single">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<SwipeView Grid.Row="0">
<SwipeView.RightItems>
<SwipeItems>
<SwipeItem Text="Delete"
BackgroundColor="{StaticResource DeleteColor}"/>
<SwipeItem Text="Edit"
BackgroundColor="{StaticResource EditColor}"/>
</SwipeItems>
</SwipeView.RightItems>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="3*"/>
</Grid.ColumnDefinitions>
<Image Grid.Column="0" Source="{Binding Path=Icon, Converter={StaticResource Base64ToImageConv}}"/>
<StackLayout Grid.Column="1">
<Label Text="{Binding Name}"/>
</StackLayout>
</Grid>
</SwipeView>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
<StackLayout Grid.Row="1" Orientation="Horizontal" HorizontalOptions="Center" VerticalOptions="End">
<Button Text="&lt;"/>
<Label Text="{Binding Index}"/>
<Label Text="/"/>
<Label Text="{Binding NbPages}"/>
<Button Text="&gt;"/>
</StackLayout>
</Grid>
</ContentPage>

@ -15,14 +15,11 @@ public partial class ChampionsListPage : ContentPage
async void AddClicked(System.Object sender, System.EventArgs e)
{
await Shell.Current.GoToAsync(nameof(ChampionAddEditPage));
await Navigation.PushAsync(new ChampionAddEditPage());
}
async void ListView_ItemSelected(System.Object sender, Microsoft.Maui.Controls.SelectedItemChangedEventArgs e)
{
await Shell.Current.GoToAsync(nameof(ChampionDetailPage), true, new Dictionary<string, object>
{
{ "ChampionVM", e.SelectedItem }
});
await Navigation.PushAsync(new ChampionDetailPage(e.SelectedItem as ChampionVM));
}
}

@ -10,7 +10,7 @@ public class Program
{
// if you want to use a different Application Delegate class from "AppDelegate"
// you can specify it here.
UIApplication.Main(args, null, typeof(AppDelegate));
UIApplication.Main(args, null, typeof(AppDelegate));
}
}

@ -17,6 +17,10 @@
<Color x:Key="Gray600">#404040</Color>
<Color x:Key="Gray900">#212121</Color>
<Color x:Key="Gray950">#141414</Color>
<Color x:Key="EditColor">#AEAEB1</Color>
<Color x:Key="DeleteColor">#FE3C30</Color>
<SolidColorBrush x:Key="PrimaryBrush" Color="{StaticResource Primary}"/>
<SolidColorBrush x:Key="SecondaryBrush" Color="{StaticResource Secondary}"/>
<SolidColorBrush x:Key="TertiaryBrush" Color="{StaticResource Tertiary}"/>

@ -15,7 +15,7 @@ Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "Tests", "Tests", "{A88951E3
EndProject
Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "App", "App\App.csproj", "{9A58F419-4627-4656-9C36-959DA39A55E9}"
EndProject
Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "ViewModel", "ViewModel\ViewModel.csproj", "{7A222D06-D84F-4DA7-ADCC-71D339261117}"
Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "ViewModel", "ViewModel\ViewModel.csproj", "{75E3813D-87BE-4837-B318-916CFA6A276F}"
EndProject
Global
GlobalSection(SolutionConfigurationPlatforms) = preSolution
@ -43,10 +43,10 @@ Global
{9A58F419-4627-4656-9C36-959DA39A55E9}.Debug|Any CPU.Build.0 = Debug|Any CPU
{9A58F419-4627-4656-9C36-959DA39A55E9}.Release|Any CPU.ActiveCfg = Release|Any CPU
{9A58F419-4627-4656-9C36-959DA39A55E9}.Release|Any CPU.Build.0 = Release|Any CPU
{7A222D06-D84F-4DA7-ADCC-71D339261117}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
{7A222D06-D84F-4DA7-ADCC-71D339261117}.Debug|Any CPU.Build.0 = Debug|Any CPU
{7A222D06-D84F-4DA7-ADCC-71D339261117}.Release|Any CPU.ActiveCfg = Release|Any CPU
{7A222D06-D84F-4DA7-ADCC-71D339261117}.Release|Any CPU.Build.0 = Release|Any CPU
{75E3813D-87BE-4837-B318-916CFA6A276F}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
{75E3813D-87BE-4837-B318-916CFA6A276F}.Debug|Any CPU.Build.0 = Debug|Any CPU
{75E3813D-87BE-4837-B318-916CFA6A276F}.Release|Any CPU.ActiveCfg = Release|Any CPU
{75E3813D-87BE-4837-B318-916CFA6A276F}.Release|Any CPU.Build.0 = Release|Any CPU
EndGlobalSection
GlobalSection(SolutionProperties) = preSolution
HideSolutionNode = FALSE

@ -48,6 +48,24 @@ namespace ViewModel
await LoadChampions();
}
public int NbPages => NbChampions / Count;
public int NbChampions
{
get => _nbChampions;
set
{
_nbChampions = value;
}
}
private int _nbChampions;
private async Task GetNbChampions()
{
NbChampions = await DataManager.ChampionsMgr.GetNbItems();
OnPropertyChanged(nameof(NbPages));
}
private async Task LoadChampions()
{
_championVMs.Clear();

@ -1,4 +1,5 @@
using Model;
using System;
namespace ViewModel
{
@ -9,7 +10,7 @@ namespace ViewModel
get => _model;
set
{
//if (_model.Equals(value) || _model.Equals(null)) return;
if (_model.Equals(value) || value == null) return;
_model = value;
OnPropertyChanged();
}
@ -19,12 +20,12 @@ namespace ViewModel
public ChampionVM(Champion model)
{
Model = model;
_model = model;
}
public ChampionVM()
{
Model = new Champion("Poppy", ChampionClass.Tank);
_model = new Champion("Poppy", ChampionClass.Tank);
}
public string Name
@ -42,5 +43,32 @@ namespace ViewModel
OnPropertyChanged();
}
}
public string Icon
{
get => Model.Icon;
set
{
if (value == null) return;
_model.Icon = value;
OnPropertyChanged();
}
}
public string Image
{
get => Model.Image.Base64;
set
{
if (value == null) return;
_model.Image.Base64 = value;
OnPropertyChanged();
}
}
public IReadOnlyDictionary<string, int> Characteristics
{
get => Model.Characteristics;
}
}
}
Loading…
Cancel
Save