Skip to content
/ BcdForm Public

BcdForm is a dialog blazor component. Use Blazor like WinForm. 像使用WinForm一样在Blazor中使用弹窗组件。

License

Notifications You must be signed in to change notification settings

BcdLib/BcdForm

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

50 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Use Blazor like WinForm. Just new a component and show it like here:

var form = new Component();
await form.ShowAsync();

Live Demo

Nuget

1.Usage

Note that the root namespace is BcdLib.Components

1.1.Add css and js to index.html or _Host.cshtml

+    <link href="_content/BcdLib.BcdForm/index.css" rel="stylesheet">
 
+    <script src="_content/BcdLib.BcdForm/index.js"></script>

1.2.Mount BcdContainer in App.razor

<Router ...>
   ...
</Router>

+ <BcdFormContainer />

1.3.Provide IServiceProvider for BcdLib in Main method of Program.cs

For server side:

+ using BcdLib.Components.Extensions;

public static void Main(string[] args)
{
    var host = CreateHostBuilder(args).Build();
+   host.Services.UseBcdForm();
    host.Run();
}

For WASM:

+ using BcdLib.Components.Extensions;

public static async Task Main(string[] args)
{
	var builder = WebAssemblyHostBuilder.CreateDefault(args);
	builder.RootComponents.Add<App>("#app");
		...
	var host = builder.Build();
+	host.Services.UseBcdForm();
	await host.RunAsync();
}

1.4.Write components and inherit from BcdForm

You must override InitComponent method. To remind developers to set some properties of the component, such as Title, it is defined as an abstract method.

Sample:

@inherits BcdForm

...

@code {
    protected override void InitComponent()
    {
        ...
    }
}

1.5.Using in your component

Jsut like using winform:

var form = new BcdFormChild();
await form.ShowAsync();

1.6.Examples

See BcdSample.Common/BcdForms for examples.

2. Be careful!

You cannot interact with child components in the root component that inherits BcdForm (only limit to the root component), such as EventCallback or @bind.

But you can using Action or Func instead of EventCallback, because Action or Func do not need a RenderHandler.

Demo see BcdLib/BcdSample.Common/BcdForms/Nesting.razor.

3.BcdForm members

3.1.Public properties

Property Type Summary Default
Title string the title of form. Default value is BcdForm "BcdForm"
Name string Unique identification, it will be used as the Id attribute of the form root DOM. If it is not defined, it will be generated by default Bcd-[Guid]
Width int The width of the form, in pixels 520
MinPosition MinPosition Where the form is minimized MinPosition.RightBottom
BodyStyle string form body's style null
DestroyOnClose bool Remove from DOM when closing.
If DestroyOnClose is false, be sure to use a global variable to accept the instance of BcdForm
true
EnableHeader bool Allow header to be displayed true
ShowMask bool Allow Mask to be displayed. Default is false false
MaskClosable bool Whether to close the form when the mask is clicked, if ShowMask is true. true
MaskStyle string the style of Mask, if ShowMask is true. null
MinimizeBox bool Allow minimization true
MinimizeBox bool Allow maximum true
Draggable bool Allow drag false
DragInViewport bool Drag is only allowed in the viewport, if Draggable is true. true
Visible bool Only can get. Whether the form is visible or not --
HasDestroyed bool Only can get. Whether the form has been removed from DOM true
FormState FormState Only can get. The form's state: maximize, minimize or normalize FormState.Normal
Centered bool centered Modal false
Footer RenderFragment? modal footer null
StickyFooter bool fix the footer at the bottom of the modal false

3.2.Protected properties

Property Type Summary Default
ServiceScope IServiceScope readonly. IServiceScope for accept dependent injection services. If you use ServiceScope in the subclass, note that it will be released at Dispose; If you don't use ServiceScope in the subclass, you can still use ShowAsync after Disposed. --
ServiceProvider IServiceProvider readonly. IServiceProvider for accept dependent injection services. --
IsDisposed bool readonly. Has the object been released false

3.3.Life cycle

Name Type Summary parameters return
InitComponent() protected abstract InitComponent will be triggered in constructors, and it's before OnShowingAsync when the form is not in the DOM. -- void
OnShowingAsync(CancelEventArgs e) protected virtual Trigger before displaying form. The display can be cancelled by CancelEventArgs. -- Task
OnClosingAsync(CancelEventArgs e) protected virtual Trigger before closing form. The close can be cancelled by CancelEventArgs -- Task
OnDestroyingAsync(CancelEventArgs e) protected virtual Trigger before the form destroying (removing) from DOM. The destroy Can be cancelled by CancelEventArgs -- Task
JsInvokeVoidAsync(string func, params object[] args) protected the proxy of IJsRuntime.InvokeVoidAsync see IJsRuntime.InvokeVoidAsync Task
JsInvokeAsync(string func, params object[] args) protected the proxy of IJsRuntime.InvokeAsync see IJsRuntime.InvokeVoidAsync ValueTask
InvokeStateHasChanged() protected StateHasChanged adapter -- void
InvokeStateHasChangedAsync() protected InvokeAsync(StateHasChanged) adapter -- Task
OnAfterRender(bool firstRender) protected virtual it will trigger in OnAfterRenderAsync, and It will be called before AfterBcdRenderAsync firstRender: Is the form rendered for the first time void
OnAfterRenderAsync(bool firstRender) protected virtual it will trigger in OnAfterRenderAsync firstRender: Is the form rendered for the first time Task
Dispose(bool disposing) protected virtual dispose resources disposing: true to dispose the form's resources void

4.OS Reference

  1. AntDesign: form's style

5.License

BcdLib GitHub license

About

BcdForm is a dialog blazor component. Use Blazor like WinForm. 像使用WinForm一样在Blazor中使用弹窗组件。

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published