feat: initialize.

This commit is contained in:
rabbitism
2024-03-09 16:00:51 +08:00
parent f93cd69d7c
commit de0124eb8e
9 changed files with 215 additions and 1 deletions

View File

@@ -0,0 +1,13 @@
<UserControl xmlns="https://github.com/avaloniaui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:u="https://irihi.tech/ursa"
mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
x:Class="Ursa.Demo.Pages.VerificationCodeDemo">
<StackPanel>
<u:VerificationCode CountOfDigit="4" Name="v4"/>
<ListBox ItemsSource="{Binding #v4.Digits}"></ListBox>
<u:VerificationCode CountOfDigit="6" PasswordChar="*" />
</StackPanel>
</UserControl>

View File

@@ -0,0 +1,13 @@
using Avalonia;
using Avalonia.Controls;
using Avalonia.Markup.Xaml;
namespace Ursa.Demo.Pages;
public partial class VerificationCodeDemo : UserControl
{
public VerificationCodeDemo()
{
InitializeComponent();
}
}

View File

@@ -56,6 +56,7 @@ public class MainViewViewModel : ViewModelBase
MenuKeys.MenuKeyTwoTonePathIcon => new TwoTonePathIconDemoViewModel(),
MenuKeys.MenuKeyThemeToggler => new ThemeTogglerDemoViewModel(),
MenuKeys.MenuKeyToolBar => new ToolBarDemoViewModel(),
MenuKeys.MenuKeyVerificationCode => new VerificationCodeDemoViewModel(),
};
}
}

View File

@@ -42,7 +42,8 @@ public class MenuViewModel: ViewModelBase
new() { MenuHeader = "Theme Toggler", Key = MenuKeys.MenuKeyThemeToggler, Status = "New" },
new() { MenuHeader = "Timeline", Key = MenuKeys.MenuKeyTimeline, Status = "WIP" },
new() { MenuHeader = "TwoTonePathIcon", Key = MenuKeys.MenuKeyTwoTonePathIcon},
new() { MenuHeader = "ToolBar", Key = MenuKeys.MenuKeyToolBar, Status = "New" }
new() { MenuHeader = "ToolBar", Key = MenuKeys.MenuKeyToolBar, Status = "New" },
new() { MenuHeader = "Verification Code", Key = MenuKeys.MenuKeyVerificationCode, Status = "New" },
};
}
}
@@ -81,5 +82,6 @@ public static class MenuKeys
public const string MenuKeyTwoTonePathIcon = "TwoTonePathIcon";
public const string MenuKeyThemeToggler = "ThemeToggler";
public const string MenuKeyToolBar = "ToolBar";
public const string MenuKeyVerificationCode = "VerificationCode";
}

View File

@@ -0,0 +1,8 @@
using CommunityToolkit.Mvvm.ComponentModel;
namespace Ursa.Demo.ViewModels;
public class VerificationCodeDemoViewModel: ObservableObject
{
}

View File

@@ -0,0 +1,34 @@
<ResourceDictionary xmlns="https://github.com/avaloniaui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:u="https://irihi.tech/ursa">
<!-- Add Resources Here -->
<ControlTheme TargetType="u:VerificationCode" x:Key="{x:Type u:VerificationCode}">
<Setter Property="Template">
<ControlTemplate TargetType="u:VerificationCode">
<u:VerificationCodeCollection Name="{x:Static u:VerificationCode.PART_ItemsControl}" ItemsSource="{TemplateBinding Digits}">
<u:VerificationCodeCollection.ItemsPanel>
<ItemsPanelTemplate>
<UniformGrid Columns="{TemplateBinding CountOfDigit}" Rows="1"></UniformGrid>
</ItemsPanelTemplate>
</u:VerificationCodeCollection.ItemsPanel>
<u:VerificationCodeCollection.ItemContainerTheme>
<ControlTheme TargetType="TextBox" BasedOn="{StaticResource {x:Type TextBox}}">
<Setter Property="IsReadOnly" Value="True"></Setter>
<Setter Property="Focusable" Value="False"></Setter>
<Setter Property="Margin" Value="8"></Setter>
<Setter Property="PasswordChar" Value="{Binding $parent[u:VerificationCode].PasswordChar}"></Setter>
</ControlTheme>
</u:VerificationCodeCollection.ItemContainerTheme>
</u:VerificationCodeCollection>
</ControlTemplate>
</Setter>
</ControlTheme>
<ControlTheme TargetType="u:VerificationCodeCollection" x:Key="{x:Type u:VerificationCodeCollection}">
<Setter Property="Template">
<ControlTemplate TargetType="u:VerificationCodeCollection">
<ItemsPresenter ItemsPanel="{TemplateBinding ItemsPanel}"></ItemsPresenter>
</ControlTemplate>
</Setter>
</ControlTheme>
</ResourceDictionary>

View File

@@ -33,5 +33,6 @@
<ResourceInclude Source="Skeleton.axaml" />
<ResourceInclude Source="TwoTonePathIcon.axaml" />
<ResourceInclude Source="ToolBar.axaml" />
<ResourceInclude Source="VerificationCode.axaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>

View File

@@ -0,0 +1,117 @@
using System.Windows.Input;
using Avalonia;
using Avalonia.Collections;
using Avalonia.Controls;
using Avalonia.Controls.Metadata;
using Avalonia.Controls.Presenters;
using Avalonia.Controls.Primitives;
using Avalonia.Input;
using Avalonia.Interactivity;
using Avalonia.LogicalTree;
using Irihi.Avalonia.Shared.Helpers;
namespace Ursa.Controls;
[TemplatePart(PART_ItemsControl, typeof(ItemsControl))]
public class VerificationCode: TemplatedControl
{
public const string PART_ItemsControl = "PART_ItemsControl";
private ItemsControl? _itemsControl;
private int _currentIndex = 0;
public static readonly StyledProperty<ICommand?> CompleteCommandProperty = AvaloniaProperty.Register<VerificationCode, ICommand?>(
nameof(CompleteCommand));
public ICommand? CompleteCommand
{
get => GetValue(CompleteCommandProperty);
set => SetValue(CompleteCommandProperty, value);
}
public static readonly StyledProperty<int> CountOfDigitProperty = AvaloniaProperty.Register<VerificationCode, int>(
nameof(CountOfDigit));
public int CountOfDigit
{
get => GetValue(CountOfDigitProperty);
set => SetValue(CountOfDigitProperty, value);
}
public static readonly StyledProperty<char> PasswordCharProperty =
AvaloniaProperty.Register<VerificationCode, char>(
nameof(PasswordChar));
public char PasswordChar
{
get => GetValue(PasswordCharProperty);
set => SetValue(PasswordCharProperty, value);
}
public static readonly DirectProperty<VerificationCode, AvaloniaList<string>> DigitsProperty = AvaloniaProperty.RegisterDirect<VerificationCode, AvaloniaList<string>>(
nameof(Digits), o => o.Digits, (o, v) => o.Digits = v);
private AvaloniaList<string> _digits = [];
internal AvaloniaList<string> Digits
{
get => _digits;
set => SetAndRaise(DigitsProperty, ref _digits, value);
}
static VerificationCode()
{
CountOfDigitProperty.Changed.AddClassHandler<VerificationCode, int>((code, args) => code.OnCountOfDigitChanged(args));
FocusableProperty.OverrideDefaultValue<VerificationCode>(true);
}
public VerificationCode()
{
InputMethod.SetIsInputMethodEnabled(this, false);
}
private void OnCountOfDigitChanged(AvaloniaPropertyChangedEventArgs<int> args)
{
var newValue = args.NewValue.Value;
if (newValue > 0)
{
Digits = new AvaloniaList<string>(Enumerable.Repeat(string.Empty, newValue));
}
}
protected override void OnApplyTemplate(TemplateAppliedEventArgs e)
{
base.OnApplyTemplate(e);
_itemsControl = e.NameScope.Get<ItemsControl>(PART_ItemsControl);
PointerPressedEvent.AddHandler(OnControlPressed, RoutingStrategies.Tunnel, false, this);
}
private void OnControlPressed(object sender, PointerPressedEventArgs e)
{
if (e.Source is Control t)
{
var text = t.FindLogicalAncestorOfType<TextBox>();
if (text != null)
{
_currentIndex = _itemsControl?.IndexFromContainer(text) ?? 0;
}
}
}
protected override void OnTextInput(TextInputEventArgs e)
{
base.OnTextInput(e);
if (e.Text?.Length == 1 && _currentIndex < CountOfDigit)
{
Digits[_currentIndex] = e.Text;
var presenter = _itemsControl?.ContainerFromIndex(_currentIndex) as TextBox;
if (presenter is null) return;
_currentIndex++;
var newPresenter = _itemsControl?.ContainerFromIndex(_currentIndex)?.Focus();
presenter.Text = e.Text;
if (_currentIndex == CountOfDigit)
{
CompleteCommand?.Execute(Digits);
}
}
}
}

View File

@@ -0,0 +1,25 @@
using Avalonia;
using Avalonia.Controls;
using Avalonia.Controls.Presenters;
using Avalonia.Data;
using Avalonia.Input;
using Avalonia.Media;
namespace Ursa.Controls;
public class VerificationCodeCollection: ItemsControl
{
protected override bool NeedsContainerOverride(object? item, int index, out object? recycleKey)
{
return NeedsContainer<TextBox>(item, out recycleKey);
}
protected override Control CreateContainerForItemOverride(object? item, int index, object? recycleKey)
{
return new TextBox()
{
TextAlignment = TextAlignment.Center,
[InputMethod.IsInputMethodEnabledProperty] = false,
};
}
}