Skip to content

Commit

Permalink
Fix an exception wehn SettingsCard is disabled
Browse files Browse the repository at this point in the history
  • Loading branch information
NotYoojun committed Dec 22, 2024
1 parent 28032d3 commit ffb8a6d
Show file tree
Hide file tree
Showing 8 changed files with 209 additions and 30 deletions.
2 changes: 1 addition & 1 deletion samples/SettingsNavigationTest/MainPage.xaml
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@
<ui:FontIcon Icon="{x:Static ui:SegoeFluentIcons.Apps}"/>
</ui:SettingsCard.HeaderIcon>
</ui:SettingsCard>
<ui:SettingsCard Header="Browser Search Engine"
<ui:SettingsCard Header="Browser Search Engine" IsEnabled="False"
Description="Choose the search engine you like.">
<ui:SettingsCard.HeaderIcon>
<ui:FontIcon Icon="{x:Static ui:SegoeFluentIcons.CloudSearch}"/>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -161,31 +161,31 @@
<VisualState x:Name="Disabled">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="PART_ActionIconPresenter"
Storyboard.TargetProperty="Foreground">
Storyboard.TargetProperty="(ui:ContentPresenterEx.Foreground)">
<DiscreteObjectKeyFrame KeyTime="0"
Value="{DynamicResource SettingsCardForegroundDisabled}" />
</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="PART_HeaderIconPresenter"
Storyboard.TargetProperty="Foreground">
Storyboard.TargetProperty="(ui:ContentPresenterEx.Foreground)">
<DiscreteObjectKeyFrame KeyTime="0"
Value="{DynamicResource SettingsCardForegroundDisabled}" />
</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="PART_HeaderPresenter"
Storyboard.TargetProperty="Foreground">
Storyboard.TargetProperty="(ui:ContentPresenterEx.Foreground)">
<DiscreteObjectKeyFrame KeyTime="0"
Value="{DynamicResource SettingsCardForegroundDisabled}" />
</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="PART_DescriptionPresenter"
Storyboard.TargetProperty="Foreground">
Storyboard.TargetProperty="(ui:ContentPresenterEx.Foreground)">
<DiscreteObjectKeyFrame KeyTime="0"
Value="{DynamicResource SettingsCardForegroundDisabled}" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
<!--<VisualState.Setters>
-->
https://stackoverflow.com/questions/25566944/wpf-theme-error-cannot-resolve-all-property-references-in-the-property-path -->
<!-- DisabledVisual Should be handled by the control, not the animated icon. -->
<!--
<Setter Target="PART_RootGrid.(muxc:AnimatedIcon.State)" Value="Normal" />
Expand Down
13 changes: 12 additions & 1 deletion source/iNKORE.UI.WPF.Modern.Gallery/Common/Extensions.cs
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
using System.Windows;
using System.Text.Json;
using System.Windows;
using System.Windows.Media;

namespace iNKORE.UI.WPF.Modern.Gallery
Expand All @@ -23,5 +24,15 @@ public static string ToHEX(this Color color)
{
return $"#{color.R:X2}{color.G:X2}{color.B:X2}";
}

public static JsonElement? TryGetProperty(this JsonElement element, string propertyName)
{
if (element.TryGetProperty(propertyName, out var value))
{
return value;
}

return null;
}
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -305,8 +305,7 @@ private async Task GetControlInfoDataAsync()
itemValue.TryGetProperty("Subtitle", out JsonElement itemSubtitleElement) &&
itemValue.TryGetProperty("ImagePath", out JsonElement itemImagePathElement) &&
itemValue.TryGetProperty("ImageIconPath", out JsonElement itemImageIconPathElement) &&
itemValue.TryGetProperty("Description", out JsonElement itemDescriptionElement) &&
itemValue.TryGetProperty("Content", out JsonElement itemContentElement))
itemValue.TryGetProperty("Description", out JsonElement itemDescriptionElement))
{
itemObject = itemValue;
}
Expand All @@ -315,6 +314,8 @@ private async Task GetControlInfoDataAsync()
continue;
}

var itemContentElement = itemValue.TryGetProperty("Content");

string badgeString = null;

bool isNew = itemObject.TryGetProperty("IsNew", out JsonElement isNewElement) && isNewElement.GetBoolean();
Expand All @@ -341,7 +342,7 @@ private async Task GetControlInfoDataAsync()
itemImageIconPathElement.GetString(),
badgeString,
itemDescriptionElement.GetString(),
itemContentElement.GetString(),
itemContentElement?.GetString() ?? "",
isNew,
isUpdated,
isPreview)
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -4,24 +4,80 @@

"Groups":
[
{
"UniqueId": "Input",
"Title": "Input",
"Subtitle": "",
"ImagePath": "",
"ImageIconPath": "",
"Description": "",
"Items":
[
]
},
//{
// "UniqueId": "Input",
// "Title": "Input",
// "Subtitle": "",
// "ImagePath": "",
// "ImageIconPath": "",
// "Description": "",
// "Items":
// [
// ]
//},
{
"UniqueId": "Layout",
"Title": "Layout",
"Subtitle": "",
"ImagePath": "",
"ImageIconPath": "",
"Description": "Use layout controls to arrange the controls and content in your app."
"Description": "Use layout controls to arrange the controls and content in your app.",
"Items":
[
{
"UniqueId": "SettingsCard",
"Title": "SettingsCard",
"Subtitle": "A card control that can be used to create Windows 11 style settins experiences.",
"ImagePath": "",
"ImageIconPath": "",
"Description": "SettingsCard is a control that can be used to display settings in your experience. It uses the default styling found in Windows 11 and is easy to use, meets all accessibility standards and will make your settings page look great! You can set the Header, Description, HeaderIcon and Content properties to create an easy to use experience.",
"IsNew": true,
"IsUpdated": true,
"Docs":
[
// To be updated
//{
// "Title": "CheckBox - API",
// "Uri": "https://docs.microsoft.com/windows/winui/api/microsoft.ui.xaml.controls.checkbox"
//},
//{
// "Title": "Guidelines",
// "Uri": "https://docs.microsoft.com/windows/apps/design/controls/checkbox"
//}
],
"RelatedControls":
[
"SettingsExpander"
]
},
{
"UniqueId": "SettingsExpander",
"Title": "SettingsExpander",
"Subtitle": "A card control that can be used to create Windows 11 style settins experiences.",
"ImagePath": "",
"ImageIconPath": "",
"Description": "The SettingsExpander can be used to group multiple s into a single collapsible group. A SettingsExpander can have it's own content to display a setting on the right, just like a SettingsCard, but in addition can have any number of extra Items to include as additional settings. These items are SettingsCards themselves, which means you can easily move a setting into or out of Expanders just by cutting and pasting their XAML!",
"IsNew": true,
"IsUpdated": true,
"Docs":
[
// To be updated
//{
// "Title": "CheckBox - API",
// "Uri": "https://docs.microsoft.com/windows/winui/api/microsoft.ui.xaml.controls.checkbox"
//},
//{
// "Title": "Guidelines",
// "Uri": "https://docs.microsoft.com/windows/apps/design/controls/checkbox"
//}
],
"RelatedControls":
[
"SettingsCard"
]
}

]
},
{
"UniqueId": "Media",
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,73 @@
<ui:Page
x:Class="iNKORE.UI.WPF.Modern.Gallery.Pages.Controls.Community.SettingsCardPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="clr-namespace:iNKORE.UI.WPF.Modern.Gallery"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:sys="clr-namespace:System;assembly=mscorlib"
xmlns:ui="http://schemas.inkore.net/lib/ui/wpf/modern" xmlns:ikw="http://schemas.inkore.net/lib/ui/wpf"
Title="Border" d:DesignWidth="800"
Loaded="Page_Loaded" mc:Ignorable="d">
<StackPanel>
<local:ControlExample x:Name="Example1" HeaderText="A Series of SettingsCards">
<local:ControlExample.Example>
<ikw:SimpleStackPanel Spacing="4">
<ui:SettingsCard x:Name="settingsCard"
Description="This is a default card, with the Header, HeaderIcon, Description and Content set."
Header="This is the Header"
IsEnabled="{Binding ElementName=EnableToggle1, Path=IsOn}">
<ui:SettingsCard.HeaderIcon>
<ui:FontIcon Glyph="&#xE799;"/>
</ui:SettingsCard.HeaderIcon>
<ComboBox SelectedIndex="0">
<ComboBoxItem>Option 1</ComboBoxItem>
<ComboBoxItem>Option 2</ComboBoxItem>
<ComboBoxItem>Option 3</ComboBoxItem>
</ComboBox>
</ui:SettingsCard>

<ui:SettingsCard Description="You can use a FontIcon, SymbolIcon or BitmapIcon to set the cards HeaderIcon."
Header="Icon options"
IsEnabled="{Binding ElementName=EnableToggle1, Path=IsOn}">
<ui:SettingsCard.HeaderIcon>
<Image Width="20" Height="20" Source="/Assets/WpfLibrary_256w.png"
RenderOptions.BitmapScalingMode="HighQuality"/>
</ui:SettingsCard.HeaderIcon>
<ui:ToggleSwitch />
</ui:SettingsCard>

<ui:SettingsCard Header="A card with custom objects as its Description"
IsEnabled="{Binding ElementName=EnableToggle1, Path=IsOn}">
<ui:SettingsCard.Description>
<ui:HyperlinkButton Content="Learn more about Inkways" />
</ui:SettingsCard.Description>
<Button Content="Open Inkways Editor"
Style="{StaticResource AccentButtonStyle}" />
</ui:SettingsCard>

<ui:SettingsCard Description="When resizing a SettingsCard, the Content will wrap vertically. You can override this breakpoint by setting the SettingsCardWrapThreshold resource. For edge cases, you can also hide the icon by setting SettingsCardWrapNoIconThreshold."
Header="Adaptive layouts"
IsEnabled="{Binding ElementName=EnableToggle1, Path=IsOn}">
<ui:SettingsCard.HeaderIcon>
<ui:FontIcon Glyph="&#xE745;"/>
</ui:SettingsCard.HeaderIcon>

<Button Content="This control will wrap vertically!"
Style="{StaticResource AccentButtonStyle}" />
</ui:SettingsCard>

<ui:SettingsCard Header="This is a card with a Header only"
IsEnabled="{Binding ElementName=EnableToggle1, Path=IsOn}"/>

</ikw:SimpleStackPanel>
</local:ControlExample.Example>

<local:ControlExample.Options>
<StackPanel>
<ui:ToggleSwitch x:Name="EnableToggle1" Header="Is Enabled" IsOn="False"/>
</StackPanel>
</local:ControlExample.Options>
</local:ControlExample>
</StackPanel>
</ui:Page>
Original file line number Diff line number Diff line change
@@ -0,0 +1,46 @@
using iNKORE.UI.WPF.Modern.Controls;
using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using Page = iNKORE.UI.WPF.Modern.Controls.Page;

namespace iNKORE.UI.WPF.Modern.Gallery.Pages.Controls.Community
{
/// <summary>
/// BorderPage.xaml 的交互逻辑
/// </summary>
public partial class SettingsCardPage : Page
{
public SettingsCardPage()
{
InitializeComponent();
}

#region Example Code

public void UpdateExampleCode()
{
}



#endregion

private void Page_Loaded(object sender, RoutedEventArgs e)
{

}
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -97,14 +97,6 @@
</Grid>
</StackPanel>
</local:ControlExample.Options>

<local:ControlExample.Xaml>
<sys:String xml:space="preserve">
&lt;Border BorderThickness=&quot;$(BorderThickness)&quot; BorderBrush=&quot;$(BorderBrush)&quot; Background=&quot;$(Background)&quot;&gt;
&lt;TextBlock Text=&quot;Text inside a border&quot; FontSize=&quot;18&quot; Foreground=&quot;Black&quot; /&gt;
&lt;/Border&gt;
</sys:String>
</local:ControlExample.Xaml>
</local:ControlExample>
</StackPanel>
</ui:Page>

0 comments on commit ffb8a6d

Please sign in to comment.