Progress on party page styling

This commit is contained in:
watsonb8 2019-12-22 23:58:29 -05:00
parent cc0d113204
commit 1a55ce0be1
9 changed files with 60 additions and 79 deletions

View File

@ -11,6 +11,8 @@ namespace Aurora.gtk
{
Gtk.Application.Init();
LibVLCSharpFormsRenderer.Init();
DLToolkit.Forms.Controls.FlowListView.Init();
// For some reason, Xamarin does not pick the LibVLCSharp.Form.Platforms.Gtk assembly as a renderer assembly.
// Add it manually.

7
Aurora/App.css Normal file
View File

@ -0,0 +1,7 @@
.primaryColor {
background-color: #232323;
}
.accentColor {
background-color: #3a3a3a;
}

View File

@ -24,6 +24,8 @@
x:Key="InverseBoolConverter"/>
<converters:ToUpperConverter
x:Key="ToUpperConverter"/>
<StyleSheet
Source="App.css"/>
</ResourceDictionary>
</Application.Resources>
</Application>

View File

@ -0,0 +1,12 @@
Frame {
margin-left: 20;
margin-right: 20;
margin-top: 20;
margin-bottom: 20;
width: 80;
}
Frame Label {
color: black;
background-color: white;
}

View File

@ -3,23 +3,30 @@
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:hl="clr-namespace:Aurora.Design.Components.HorizontalList"
xmlns:flv="clr-namespace:DLToolkit.Forms.Controls;assembly=DLToolkit.Forms.Controls.FlowListView"
x:Class="Aurora.Design.Components.MemberList.MemberList">
<ContentView.Resources>
<StyleSheet
Source="./MemberList.css"/>
</ContentView.Resources>
<ContentView.Content>
<StackLayout>
<hl:HorizontalList
BackgroundColor="Red"
x:Name="MembersHorizontalList"
ListOrientation="Horizontal"
VerticalOptions="Start">
<hl:HorizontalList.ItemTemplate>
<DataTemplate>
<Frame>
<Label
Text="{Binding UserName}"/>
</Frame>
</DataTemplate>
</hl:HorizontalList.ItemTemplate>
</hl:HorizontalList>
</StackLayout>
<flv:FlowListView
x:Name="MembersList"
FlowColumnCount="8"
RowHeight="150"
VerticalOptions="FillAndExpand"
SeparatorVisibility="None"
HasUnevenRows="false"
StyleClass="accentColor">
<flv:FlowListView.FlowColumnTemplate>
<DataTemplate>
<Frame>
<Label
Text="{Binding UserName}"
TextColor="White"/>
</Frame>
</DataTemplate>
</flv:FlowListView.FlowColumnTemplate>
</flv:FlowListView>
</ContentView.Content>
</ContentView>

View File

@ -1,16 +1,16 @@
using System;
using System.Collections.ObjectModel;
using System.Collections.Specialized;
using System.Collections;
using System.Linq;
using Xamarin.Forms;
using Aurora.Proto.Party;
using DLToolkit.Forms.Controls;
namespace Aurora.Design.Components.MemberList
{
public partial class MemberList : ContentView
{
private static ObservableCollection<PartyMember> _newSource;
// private static NotifyCollectionChangedEventHandler _collectionChangedHandler;
public MemberList()
{
InitializeComponent();
@ -55,60 +55,11 @@ namespace Aurora.Design.Components.MemberList
private static void OnMembersChanged(BindableObject bindable, object oldValue, object newValue)
{
var control = (MemberList)bindable;
var membersList = control.FindByName("MembersHorizontalList") as HorizontalList.HorizontalList;
if (membersList != null)
var membersList = control.FindByName("MembersList") as FlowListView;
if (newValue is ICollection source)
{
_newSource = newValue as ObservableCollection<PartyMember>;
membersList.ItemsSource = new ObservableCollection<object>(_newSource);
//Setup collection changed listeners
//TODO evaluate for memory leak
_newSource.CollectionChanged += (sender, e) => HandleCollectionChanged(sender, e, bindable);
}
}
private static void HandleCollectionChanged(object sender, NotifyCollectionChangedEventArgs e, BindableObject bindable)
{
MemberList self = bindable as MemberList;
var membersList = self.FindByName("MembersHorizontalList") as HorizontalList.HorizontalList;
switch (e.Action)
{
case NotifyCollectionChangedAction.Add:
{
foreach (PartyMember member in e.NewItems)
{
membersList.ItemsSource.Add(member);
}
break;
}
case NotifyCollectionChangedAction.Remove:
{
foreach (PartyMember member in e.NewItems)
{
//Find all matches
var sourceMembers = membersList.ItemsSource.Where((object obj) =>
{
bool match = false;
if (obj is PartyMember)
{
PartyMember tmp = obj as PartyMember;
match = tmp.Id == member.Id;
}
return match;
});
//Remove found matches
foreach (object obj in sourceMembers)
{
membersList.ItemsSource.Remove(obj);
}
}
break;
}
membersList.FlowItemsSource = source;
}
}
}

View File

@ -1,8 +1,4 @@
^ContentPage {
background-color: #232323;
}
#Header {
#Header {
background-color: transparent;
margin-top: 10;
}

View File

@ -6,7 +6,8 @@
xmlns:navigation="clr-namespace:Aurora.Design.Components.NavigationMenu"
xmlns:mp="clr-namespace:Aurora.Design.Components.MediaPlayer"
xmlns:dialog="clr-namespace:Aurora.Design.Components.Dialogs"
x:Class="Aurora.Design.Views.Main.MainView">
x:Class="Aurora.Design.Views.Main.MainView"
StyleClass="primaryColor">
<ContentPage.Resources>
<StyleSheet
Source="MainView.css"/>

View File

@ -3,6 +3,7 @@
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:tabView="clr-namespace:Aurora.Design.Components.TabView"
xmlns:ml="clr-namespace:Aurora.Design.Components.MemberList"
xmlns:library="clr-namespace:Aurora.Design.Components.Library"
xmlns:flv="clr-namespace:DLToolkit.Forms.Controls;assembly=DLToolkit.Forms.Controls.FlowListView"
x:Class="Aurora.Design.Views.Party.PartyView">
@ -20,8 +21,10 @@
<tabView:TabViewControl.ItemSource>
<tabView:TabItem
HeaderText="Members">
<Label
Text="Members" TextColor="White"/>
<ml:MemberList
x:Name="MembersList"
VerticalOptions="FillAndExpand"
Members="{Binding Members}"/>
</tabView:TabItem>
<tabView:TabItem
HeaderText="Queue">