From f32d4eb71cd479c174199f5177a20c281156bfd4 Mon Sep 17 00:00:00 2001 From: Ieuan Walker Date: Thu, 6 Apr 2023 21:53:21 +0100 Subject: [PATCH] Update README.md --- README.md | 20 +++++++++++--------- 1 file changed, 11 insertions(+), 9 deletions(-) diff --git a/README.md b/README.md index 1b9f593..0809ac2 100644 --- a/README.md +++ b/README.md @@ -1,9 +1,6 @@ | :memo: | This is a MAUI version of my [Xamarin NuGet](https://github.com/IeuanWalker/Xamarin.Forms.StateButton) | |---------------|:------------------------| -| :warning: | I havnt tested iOS yet, (all should be fine though) | -|---------------|:------------------------| - # Maui.StateButton [![Nuget](https://img.shields.io/nuget/v/IeuanWalker.Maui.StateButton)](https://www.nuget.org/packages/IeuanWalker.Maui.StateButton) [![Nuget](https://img.shields.io/nuget/dt/IeuanWalker.Maui.StateButton)](https://www.nuget.org/packages/IeuanWalker.Maui.StateButton) [![License: MIT](https://img.shields.io/badge/License-MIT-green.svg)](https://opensource.org/licenses/MIT) @@ -15,25 +12,24 @@ This is possible as it acts as a wrapper to your XAML and provides you the event It's also **100% accessible** with each platform seeing/ treating the control as a native button. -The [example page](https://github.com/IeuanWalker/Maui.StateButton/blob/master/Demo/ExamplePage.xaml), has a bunch of different design to showcase the usage - +Check out the [examples](https://github.com/IeuanWalker/Maui.StateButton/tree/master/Demo/Controls/Examplesl), for a bunch of different designs - ![Example gif](/Example.gif) ## How to use it? Install the [NuGet package](https://www.nuget.org/packages/IeuanWalker.Maui.StateButton/) into your shared project project ``` -Install-Package IeuanWalker.StateButton +Install-Package IeuanWalker.Maui.StateButton ``` Then in the MauiProgram.cs, and the StateButton configuration method - ```csharp -using StateButton; +using IeuanWalker.Maui.StateButton; ``` ```csharp builder .UseMauiApp() - .UseMauiCommunityToolkit() - .ConfigureStateButton(); + .UseStateButton(); ``` ## What can I do with it? @@ -81,7 +77,7 @@ Simply add a Trigger to any element and bind it to the `State` property of the b ``` -More exmaples can be found in the demo app - https://github.com/IeuanWalker/Maui.StateButton/blob/master/Demo/ExamplePage.xaml +More examples can be found in the demo app - https://github.com/IeuanWalker/Maui.StateButton/tree/master/Demo/Controls/Examples ## Accessibility The control itself is seen as a native button on both platforms, so inherits the same accessbility attributes. So from a screenreader and keyboard POV it is a native button. @@ -92,5 +88,11 @@ There are a few things you can do to improve the accessibility - 2. Optionally you can also set the [`SemanticProperties.Hint`](https://docs.microsoft.com/en-us/dotnet/maui/fundamentals/accessibility#hint) property. Using this property you can give more context to what the button is for/ will do. +For example, setting the `SemanticProperties.Description` to 'Reload', and `SemanticProperties.Hint` to 'Reload list of contacts'. The user using a screen reader will here something like - 'Reload button, Reload list of contacts, double tap to activate' + +## Recomended usage +I recommend creating a [`ControlTemplate`](https://learn.microsoft.com/en-us/dotnet/maui/fundamentals/controltemplate?view=net-maui-7.0) so you can easily re-use the control. You can see how i do this in the `Example6` example button ([xaml](https://github.com/IeuanWalker/Maui.StateButton/blob/master/Demo/Controls/Examples/Example6.xaml)/ [c#](https://github.com/IeuanWalker/Maui.StateButton/blob/master/Demo/Controls/Examples/Example6.xaml.cs)) + + ## License [![FOSSA Status](https://app.fossa.com/api/projects/git%2Bgithub.com%2FIeuanWalker%2FMaui.StateButton.svg?type=large)](https://app.fossa.com/projects/git%2Bgithub.com%2FIeuanWalker%2FMaui.StateButton?ref=badge_large)