Comments (6)
Yes, I missed that I had to add the following namespace to the _Imports.razor file.
@using Microsoft.FluentUI.AspNetCore.Components.Extensions
It now works the same as 4.6.1.
My name is Jay Tandon, and would like to thank you for your work on this project. I will close this as completed. The Split Button I was asking for is the same as the 'Close with Comment'/''Reopen Issue' split button on this page, which is the only type of button that is missing for my upgrade from MVC to Blazor. The demo was good, and you do have a navbar, which is called Header in the Layout page of your examples. Thanks again for your work, I am unfortunately too busy, as I am the only developer in my company, to work on side projects and write a split button myself.
from fluentui-blazor.
What is your @context
?. You can only use ToAttributeValue
on an enum. My guess is this is not a regression. CustomColor
should be supplied with an actual color value.
from fluentui-blazor.
The code is from the demo site. In the Themes section. Here is the full code (I just used the copy button to get the code). It ran without error before the upgrade, but errors after the upgrade. No code was changed.
<FluentDesignTheme @bind-Mode="@Mode"
@bind-OfficeColor="@OfficeColor"
OnLoaded="@OnLoaded"
OnLuminanceChanged="@OnLuminanceChanged"
StorageName="theme" />
<div style="min-height: 250px;">
<FluentGrid>
<FluentGridItem>
<FluentSelect Label="Theme"
Width="250px"
Items="@(Enum.GetValues<DesignThemeModes>())"
@bind-SelectedOption="@Mode" />
</FluentGridItem>
<FluentGridItem>
<FluentSelect Label="Color"
Items="@(Enum.GetValues<OfficeColor>().Select(i => (OfficeColor?)i))"
Height="200px"
Width="250px"
@bind-SelectedOption="@OfficeColor">
<OptionTemplate>
<FluentStack>
<FluentIcon Value="@(new Icons.Filled.Size20.RectangleLandscape())"
Color="Color.Custom"
CustomColor="@(@context.ToAttributeValue() != "default" ? context.ToAttributeValue() : "#036ac4" )" />
<FluentLabel>@context</FluentLabel>
</FluentStack>
</OptionTemplate>
</FluentSelect>
<FluentButton Appearance="Appearance.Accent" OnClick="PickRandomColor">Feeling lucky?</FluentButton>
</FluentGridItem>
</FluentGrid>
<FluentStack Style="margin: 30px 0px; padding: 30px; border: 1px solid var(--accent-fill-rest);">
<FluentIcon Value="@(new Icons.Regular.Size24.Airplane())" />
<FluentLabel>Example of content</FluentLabel>
<FluentButton Appearance="Appearance.Outline">Outline button</FluentButton>
<FluentButton Appearance="Appearance.Accent">Accent button</FluentButton>
</FluentStack>
</div>
@code
{
public DesignThemeModes Mode { get; set; }
public OfficeColor? OfficeColor { get; set; }
void OnLoaded(LoadedEventArgs e)
{
DemoLogger.WriteLine($"Loaded: {(e.Mode == DesignThemeModes.System ? "System" : "")} {(e.IsDark ? "Dark" : "Light")}");
}
void OnLuminanceChanged(LuminanceChangedEventArgs e)
{
DemoLogger.WriteLine($"Changed: {(e.Mode == DesignThemeModes.System ? "System" : "")} {(e.IsDark ? "Dark" : "Light")}");
}
void PickRandomColor()
{
OfficeColor = OfficeColorUtilities.GetRandom();
}
}
Before the upgrade, which still runs without error, the versions were <PackageReference Include="Microsoft.FluentUI.AspNetCore.Components" Version="4.6.1" />,
<PackageReference Include="Microsoft.FluentUI.AspNetCore.Components.DataGrid.EntityFrameworkAdapter" Version="4.6.1" /> and
<PackageReference Include="Microsoft.FluentUI.AspNetCore.Components.Icons" Version="4.6.1" />
After the upgrade, which has the error .. see the screenshot, the versions were <PackageReference Include="Microsoft.FluentUI.AspNetCore.Components" Version="4.7.1" />,
<PackageReference Include="Microsoft.FluentUI.AspNetCore.Components.DataGrid.EntityFrameworkAdapter" Version="4.7.0" /> and
<PackageReference Include="Microsoft.FluentUI.AspNetCore.Components.Icons" Version="4.7.0" />
Please try it yourself.
from fluentui-blazor.
Here is the screenshot of it working in Version="4.6.1"
from fluentui-blazor.
In Version="4.7.1", I have to change the code to make it work, as in this screenshot, by removing the 'ToAttributeValue' feature:
from fluentui-blazor.
I think you are running into the breaking change we mentioned in the blogs, WhatsNew and upgrade guide...
Extension methods are moved to a new namespace. Add that new namespace to the _Imports file and it should be fine.
from fluentui-blazor.
Related Issues (20)
- feat: add dynamically recognized type to FluentSelect bind-Value HOT 1
- FluentSortableList demo is failing with error "Sortable is not defined" HOT 1
- docs: add explanation about manually specifying Value property in FluentOption
- feat: add ability to pass in RenderFragment to Toast HOT 1
- FluentProfileMenu does not work in Azure HOT 4
- UpdaDialogAsync does not update anything in the dialog displayed by DialogService HOT 2
- feat: add [Parameter] to/in DataGrid TemplateColumn SortBy HOT 7
- fix: dynamic tabs are not working correctly HOT 1
- fix: FluentSelect is always open when Multiple="true" HOT 5
- fix: DatePicker year selection not working with component within EditForm HOT 1
- FluentDataGrid does not refresh and update after items changed HOT 1
- fix: GridTemplateColumns usage in FluentDataGrid with SelectColumn
- fix: Select all/none from SelectColumn component on multiple mode does not work in a FluentDataGrid component using ItemsProvider. HOT 2
- Fluent emoji nuget package increases ram and disk usage to %100 HOT 3
- fix: Rows render multiple times when DataGrid has changes (performance issue) HOT 2
- fix: Column separator can get hidden when resizing columns in DataGrid HOT 4
- fix: OnRowFocus in FluentDataGrid not triggered HOT 1
- Select not working with CultureInfo en-GB on .NET MAUI blazor hybrid HOT 2
- Wizard in Dialog not editable HOT 1
- Export options for data grid HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from fluentui-blazor.