MudBlazor.Extensions
1.2.2
Install-Package MudBlazor.Extensions -Version 1.2.2
dotnet add package MudBlazor.Extensions --version 1.2.2
<PackageReference Include="MudBlazor.Extensions" Version="1.2.2" />
paket add MudBlazor.Extensions --version 1.2.2
#r "nuget: MudBlazor.Extensions, 1.2.2"
// Install MudBlazor.Extensions as a Cake Addin
#addin nuget:?package=MudBlazor.Extensions&version=1.2.2
// Install MudBlazor.Extensions as a Cake Tool
#tool nuget:?package=MudBlazor.Extensions&version=1.2.2
MudBlazor.Extensions
MudBlazor.Extensions is a small extension for MudBlazor from https://mudblazor.com/
Using
Using is as easy it can be Sure you need a MudBlazor project and the referenced package to MudBlazor for more informations and help see https://mudblazor.com/ and https://github.com/MudBlazor/Templates
Add the nuget Package MudBlazor.Extensions
to your blazor project
Now you can start using it. Currently we only have extensions for the Mud Dialog Service
Make dialogs resizeable or draggable
var options = new DialogOptionsEx { Resizeable = true, DragMode = MudDialogDragMode.Simple, CloseButton = true, FullWidth = true };
var dialog = await _dialogService.ShowEx<YourMudDialog>("your dialog title", parameters, options);
Add Maximize Button
var options = new DialogOptionsEx { MaximizeButton = true, CloseButton = true};
var dialog = await _dialogService.ShowEx<YourMudDialog>("your Dialog title", parameters, options);
Add Custom Buttons
First in your component code you need to define the callback methods as JSInvokable
[JSInvokable]
public void AlarmClick()
{
// OnAlarmButton Click
}
[JSInvokable]
public void ColorLensClick()
{
// OnColorLensButton Click
}
Then define your custom buttons
var buttons = new[]
{
new MudDialogButton( DotNetObjectReference.Create(this as object), nameof(AlarmClick)) {Icon = Icons.Filled.Alarm},
new MudDialogButton( DotNetObjectReference.Create(this as object), nameof(ColorLensClick)) {Icon = Icons.Filled.ColorLens},
};
var options = new DialogOptionsEx { MaximizeButton = true, CloseButton = true, Buttons = buttons};
var dialog = await _dialogService.ShowEx<YourMudDialog>("your dialog title", parameters, options);
Now a dialog can look like this
Use animation to show dialog
var options = new DialogOptionsEx {
MaximizeButton = true,
CloseButton = true,
Buttons = buttons,
Position = DialogPosition.CenterRight,
Animation = AnimationType.SlideIn,
AnimationDuration = TimeSpan.FromMilliseconds(500),
FullHeight = true
};
var dialog = await _dialogService.ShowEx<YourMudDialog>("your dialog title", parameters, options);
Change Log
- 1.2.0 Slide in animations for dialogs.
- 1.1.2 New option FullHeight for dialogs
Planned Features
Notice this is just a first preview version. There are some features planned like
- Dragging with snap behaviour
- Charm in and out behavior for left, right, top and bottom
- Automatic generation for a dialog to edit given model
Product | Versions |
---|---|
.NET | net6.0 net6.0-android net6.0-ios net6.0-maccatalyst net6.0-macos net6.0-tvos net6.0-windows |
-
net6.0
- Microsoft.AspNetCore.Components.Web (>= 6.0.1)
- Microsoft.Extensions.FileProviders.Embedded (>= 6.0.1)
- MudBlazor (>= 6.0.2)
- Nextended.Core (>= 6.0.2)
NuGet packages
This package is not used by any NuGet packages.
GitHub repositories
This package is not used by any popular GitHub repositories.
Version | Downloads | Last updated |
---|---|---|
1.2.2 | 193 | 3/31/2022 |
1.2.1 | 60 | 3/24/2022 |
1.2.0 | 245 | 12/27/2021 |
1.1.0 | 335 | 12/5/2021 |
1.0.0-preview.211002142256 | 115 | 10/2/2021 |