Skip to content

Commit

Permalink
Merge pull request #78 from swety2003/main
Browse files Browse the repository at this point in the history 
Add SettingsExpander
  • Loading branch information
@NotYoojun
NotYoojun authored Aug 18, 2024
2 parents 5d2d68e + 93ac676 commit 081a3a6
Show file tree
Hide file tree
Showing 15 changed files with 1,163 additions and 46 deletions.
66 changes: 66 additions & 0 deletions samples/SettingsNavigationTest/MainPage.xaml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,71 @@
<ComboBoxItem Content="Yandex"/>
</ComboBox>
</ui:SettingsCard>

<ui:SettingsExpander x:Name="settingsCard"
Description="The SettingsExpander has the same properties as a Card, and you can set SettingsCard as part of the Items collection."
Header="SettingsExpander">
<ui:SettingsExpander.HeaderIcon>
<ui:FontIcon Icon="{x:Static ui:SegoeFluentIcons.Home}"/>
</ui:SettingsExpander.HeaderIcon>
<!-- TODO: This should be TwoWay bound but throws compile error in Uno. -->
<ComboBox SelectedIndex="0">
<ComboBoxItem>Option 1</ComboBoxItem>
<ComboBoxItem>Option 2</ComboBoxItem>
<ComboBoxItem>Option 3</ComboBoxItem>
</ComboBox>

<ui:SettingsExpander.Items>
<ui:SettingsCard Header="A basic SettingsCard within an SettingsExpander">
<Button Content="Button" />
</ui:SettingsCard>
<ui:SettingsCard Description="SettingsCard within an Expander can be made clickable too!"
Header="This item can be clicked"
IsClickEnabled="True" />

<ui:SettingsCard ContentAlignment="Left">
<CheckBox Content="Here the ContentAlignment is set to Left. This is great for e.g. CheckBoxes or RadioButtons." />
</ui:SettingsCard>

<ui:SettingsCard HorizontalContentAlignment="Left"
ContentAlignment="Vertical"
Description="You can also align your content vertically. Make sure to set the HorizontalAlignment to Left when you do!"
Header="Vertically aligned">
<ui:GridView SelectedIndex="1">
<ui:GridViewItem>
<Border Width="64"
Height="64"
Background="#0078D4"
CornerRadius="4" />
</ui:GridViewItem>
<ui:GridViewItem>
<Border Width="64"
Height="64"
Background="#005EB7"
CornerRadius="4" />
</ui:GridViewItem>
<ui:GridViewItem>
<Border Width="64"
Height="64"
Background="#003D92"
CornerRadius="4" />
</ui:GridViewItem>
<ui:GridViewItem>
<Border Width="64"
Height="64"
Background="#001968"
CornerRadius="4" />
</ui:GridViewItem>
</ui:GridView>
</ui:SettingsCard>
<ui:SettingsCard Description="You can override the Left indention of a SettingsCard by overriding the SettingsCardLeftIndention"
Header="Customization">

</ui:SettingsCard>
</ui:SettingsExpander.Items>
</ui:SettingsExpander>


<ui:SettingsCard Header="Sidebar"
Description="Provides many useful tools.">
<ui:SettingsCard.HeaderIcon>
Expand All @@ -46,5 +111,6 @@
</ui:SettingsCard.HeaderIcon>
<ui:ToggleSwitch HorizontalContentAlignment="Right"/>
</ui:SettingsCard>

</ikw:SimpleStackPanel>
</Page>
4 changes: 2 additions & 2 deletions samples/SettingsNavigationTest/MainWindow.xaml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,13 +9,13 @@
ui:ThemeManager.IsThemeAware="True"
ui:WindowHelper.SystemBackdropType="Mica"
ui:WindowHelper.UseModernWindowStyle="True"
Title="SettingsNavigationTest" Height="450" Width="800">
Title="SettingsNavigationTest" Height="756" Width="800">
<Grid Margin="25,15,15,15">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<TextBlock Text="Settings" FontSize="28" Grid.Row="0"/>
<ui:Frame x:Name="SettingsFrame" Grid.Row="1" Margin="0,20,0,0"/>
<ui:Frame x:Name="SettingsFrame" Grid.Row="1" Margin="0,20,0,0" ScrollViewer.VerticalScrollBarVisibility="Auto"/>
</Grid>
</Window>
10 changes: 8 additions & 2 deletions ...ttingsControls/SettingsCard.Properties.cs → ...s/SettingsCard/SettingsCard.Properties.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.

using System;
using System.Windows;

namespace iNKORE.UI.WPF.Modern.Controls
Expand Down Expand Up @@ -69,7 +70,7 @@ public partial class SettingsCard
nameof(ContentAlignment),
typeof(ContentAlignment),
typeof(SettingsCard),
new PropertyMetadata(defaultValue: ContentAlignment.Right));
new PropertyMetadata(defaultValue: ContentAlignment.Right, (d, e) => ((SettingsCard)d).OnContentAlignmentPropertyChanged((ContentAlignment)e.OldValue, (ContentAlignment)e.NewValue)));

/// <summary>
/// The backing <see cref="DependencyProperty"/> for the <see cref="IsActionIconVisible"/> property.
Expand Down Expand Up @@ -177,6 +178,12 @@ protected virtual void OnIsActionIconVisiblePropertyChanged(bool oldValue, bool
{
OnActionIconChanged();
}

protected virtual void OnContentAlignmentPropertyChanged(ContentAlignment oldValue, ContentAlignment newValue)
{
this.UpdateContentAlignmentState();
}

}

public enum ContentAlignment
Expand All @@ -194,5 +201,4 @@ public enum ContentAlignment
/// </summary>
Vertical
}

}
84 changes: 81 additions & 3 deletions ...Controls/SettingsControls/SettingsCard.cs → ...ingsControls/SettingsCard/SettingsCard.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,6 @@ static SettingsCard()
internal static readonly DependencyPropertyDescriptor IsPressedPropertyDescriptior = DependencyPropertyDescriptor.FromProperty(IsPressedProperty, typeof(SettingsCard));
internal static readonly DependencyPropertyDescriptor IsMouseOverPropertyDescriptior = DependencyPropertyDescriptor.FromProperty(IsMouseOverProperty, typeof(SettingsCard));


/// <summary>
/// Creates a new instance of the <see cref="SettingsCard"/> class.
/// </summary>
Expand Down Expand Up @@ -83,15 +82,22 @@ public override void OnApplyTemplate()
SetAccessibleContentName();

IsEnabledChanged += OnIsEnabledChanged;
SizeChanged += SettingsCard_SizeChanged;

// RegisterPropertyChangedCallback(ContentProperty, OnContentChanged);
}

private void SettingsCard_SizeChanged(object sender, SizeChangedEventArgs e)
{
this.UpdateContentAlignmentState();
}

private static void ContentProperty_ValueChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
if (d is SettingsCard control)
{
control.OnContentChanged(e.OldValue, e.NewValue);
control.UpdateContentVisibilityStates();
}
}

Expand Down Expand Up @@ -136,6 +142,23 @@ private void DisableButtonInteraction()
//PreviewKeyUp -= Control_PreviewKeyUp;
}

protected override void OnMouseLeftButtonDown(MouseButtonEventArgs e)
{
base.OnMouseLeftButtonDown(e);

if (!this.IsClickEnabled)
e.Handled = false;
}
protected override void OnMouseLeftButtonUp(MouseButtonEventArgs e)
{
base.OnMouseLeftButtonUp(e);

if (!this.IsClickEnabled)
e.Handled = false;
}



//private void Control_PreviewKeyUp(object sender, KeyEventArgs e)
//{
// if (e.Key == Key.Enter || e.Key == Key.Space) // || e.Key == Key.GamepadA
Expand Down Expand Up @@ -168,7 +191,7 @@ private void DisableButtonInteraction()
//protected override void OnMouseDown(MouseButtonEventArgs e)
//{
// base.OnMouseDown(e);

// if (IsClickEnabled && IsEnabled)
// {
// this.IsPressed = true;
Expand Down Expand Up @@ -196,7 +219,7 @@ private void DisableButtonInteraction()
//protected override void OnMouseLeave(MouseEventArgs e)
//{
// base.OnMouseLeave(e);

// if (IsClickEnabled && IsEnabled)
// VisualStateManager.GoToState(this, NormalState, true);
//}
Expand Down Expand Up @@ -228,6 +251,61 @@ private void UpdatePointerState()
VisualStateManager.GoToState(this, state, true);
}

private void UpdateContentAlignmentState()
{
// Manually go to states, adapted from:
// https://github.com/CommunityToolkit/Windows/blob/main/components/SettingsControls/src/SettingsCard/SettingsCard.xaml#L304-353

string state = null;

if (this.ContentAlignment == ContentAlignment.Left)
{
state = LeftState;
}
else if (this.ContentAlignment == ContentAlignment.Vertical)
{
state = VerticalState;
}
else
{
var SettingsCardWrapNoIconThreshold = this.FindResource("SettingsCardWrapNoIconThreshold") as double?;
var SettingsCardWrapThreshold = this.FindResource("SettingsCardWrapThreshold") as double?;

if (SettingsCardWrapThreshold != null && SettingsCardWrapThreshold != null)
{
if (this.ActualWidth < SettingsCardWrapNoIconThreshold)
{
state = RightWrappedNoIconState;
}
else if (this.ActualWidth < SettingsCardWrapThreshold)
{
state = RightWrappedState;
}
else
{
state = RightState;
}
}
}

if (state != null)
{
VisualStateManager.GoToState(this, state, true);
}
}

public void UpdateContentVisibilityStates()
{
// Manually go to states, adapted from:
// https://github.com/CommunityToolkit/Windows/blob/main/components/SettingsControls/src/SettingsCard/SettingsCard.xaml#L369

var state = this.Content == null || this.Content as string == ""
? nameof(Visibility.Collapsed)
: nameof(Visibility.Visible);

VisualStateManager.GoToState(this, state, true);
}

/// <summary>
/// Creates AutomationPeer
/// </summary>
Expand Down
Loading

0 comments on commit 081a3a6

Please sign in to comment.