https://github.com/atc-net/atc-blazor
A common set of Blazor libraries
https://github.com/atc-net/atc-blazor
blazor components-library
Last synced: 2 months ago
JSON representation
A common set of Blazor libraries
- Host: GitHub
- URL: https://github.com/atc-net/atc-blazor
- Owner: atc-net
- License: mit
- Created: 2022-01-28T15:18:31.000Z (over 4 years ago)
- Default Branch: main
- Last Pushed: 2024-05-07T06:05:09.000Z (about 2 years ago)
- Last Synced: 2024-05-07T07:25:40.382Z (about 2 years ago)
- Topics: blazor, components-library
- Language: C#
- Homepage: https://atc-net.github.io/repository/atc-blazor
- Size: 240 KB
- Stars: 1
- Watchers: 5
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
[](https://www.nuget.org/packages/Atc.Blazor.ColorThemePreference)
# Atc.Blazor
This repository contains packages with components for Blazor application:
| Package | Description |
|---|---|
| Atc.Blazor.ColorThemePreference | A library for detecting the user preferred color theme |
## Requirements
* [.NET 8 Runtime](https://dotnet.microsoft.com/en-us/download/dotnet/8.0)
## Get started Atc.Blazor
### Installation for Atc.Blazor
```powershell
Install-Package Atc.Blazor
```
### How to Use `NavigationManager.TryGetQueryString`
```csharp
int myInt = 0;
NavigationManager.TryGetQueryString("myKey", out var myInt)
```
### How to Use `QueryStringParameterAttribute` and `SetPropertiesWithDecoratedQueryStringParameterFromQueryString`
```csharp
@page "/"
@inject NavigationManager NavigationManager
My age is: @Age
@code
{
[QueryStringParameter]
public int Age { get; set; }
public override Task SetParametersAsync(ParameterView parameters) // Overload from Blazor components lifecycle
{
this.SetPropertiesWithDecoratedQueryStringParameterFromQueryString(NavigationManager); // Bind from url-qyery-parameter 'age' to property 'Age'
return base.SetParametersAsync(parameters);
}
}
```
```csharp
@page "/"
@inject NavigationManager NavigationManager
My age is: @Age
@code
{
[QueryStringParameter("myAge")]
public int Age { get; set; }
public override Task SetParametersAsync(ParameterView parameters) // Overload from Blazor components lifecycle
{
this.SetPropertiesWithDecoratedQueryStringParameterFromQueryString(NavigationManager); // Bind from url-qyery-parameter 'myAge' to property 'Age'
return base.SetParametersAsync(parameters);
}
}
```
### How to Use `QueryStringParameterAttribute` and `UpdateQueryStringFromPropertiesWithDecoratedQueryStringParameter`
```csharp
@page "/"
@inject NavigationManager NavigationManager
Update url
@code
{
[QueryStringParameter]
public int Age { get; set; }
public void UpdateQueryStringWithAge(int age)
{
this.Age = age;
this.UpdateQueryString(NavigationManager);
}
}
```
## Get started Atc.Blazor.ColorThemePreference
### Installation for Atc.Blazor.ColorThemePreference
```powershell
Install-Package Atc.Blazor.ColorThemePreference
```
### How to Setup
Modify `Program.cs` by adding to the service builder:
```csharp
var builder = WebAssemblyHostBuilder.CreateDefault(args);
builder.RootComponents.Add("#app");
builder.RootComponents.Add("head::after");
builder.Services.AddScoped(sp => new HttpClient { BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) });
builder.Services.AddColorThemePreferenceDetector(); // Require package: Atc.Blazor.ColorThemePreference
await builder.Build().RunAsync();
```
Modify `index.html` by adding:
```html
```
### How to Use
```csharp
@inject IColorThemePreferenceDetector colorThemePreferenceDetector;
Use Light-Mode: @useLightMode
Use Dark-Mode: @useDarkMode
@code
{
private bool useLightMode;
private bool useDarkMode;
protected override async Task OnInitializedAsync()
{
useLightMode = await colorThemePreferenceDetector.UseLightMode();
useDarkMode = await colorThemePreferenceDetector.UseDarkMode();
await base.OnInitializedAsync();
}
}
```
## How to contribute
[Contribution Guidelines](https://atc-net.github.io/introduction/about-atc#how-to-contribute)
[Coding Guidelines](https://atc-net.github.io/introduction/about-atc#coding-guidelines)