[Enhancement] Add MobileBlazorBindings as analogue to xaml

[ParadiseFallen]

Summary

I think it's worth adding support for this out of the box. This will be the equivalent for XAML. This will give you a lower threshold for MAUI entry if you have experience with blazor. It's also worth mentioning that Blazor's syntax and structure is much more straightforward and easy to understand than very large xaml files.

Repo with mobile blazor bindings for xamarin

https://github.com/dotnet/MobileBlazorBindings

[ParadiseFallen]

Hello, @Eilon. I'm surprised this improvement has been moved to the backlog.

I would like to know if this improvement will be implemented?

And when will it be possible to use advanced markup for elements instead of the old and boring xaml?

From what I understand, this will not be included in the first MAUI release. because there is still a lot of work on the MAUI itself. But will it be in the second MAUI update? how long will it take after the release to enter such a convenient thing as razor markup?

If MAUI will support razor syntax it will be awesome. It will be mich easier to work with it. Also bindings will be easier

@if()
{}
@foreach(){}
// etc
<Input @bind-Value="@Name"/>

It also seems to me that this will attract more people to use MAUI to create cross-platform applications. This syntax is much simpler and easier to understand than XAML. This is easier to understand for anyone who has used Blazor / React / etc.

[Eilon]

Use Blazor for native UI is something that we are experimenting with in Mobile Blazor Bindings but it is not in scope for .NET MAUI at this time. It's an area that the Blazor team is thinking about but we don't have specific plans on when we would start working on it.

[danroth27]

See https://github.com/dotnet/aspnetcore/issues/44866 for some thoughts on this issue.

[ghost]

We've moved this issue to the Backlog milestone. This means that it is not going to be worked on for the coming release. We will reassess the backlog following the current release and consider this item at that time. To learn more about our issue management process and to have better expectation regarding different types of issues you can read our Triage Process.

[syedqutub]

This approach is similar to React Native and is highjly appealing for couple of reasons 1) Blazor follows MVU or UI Function of State Model. this model is loved for it's small learning curve (as compared to XAML) and composition style. 2) Blazor if compared with UI as code pattern is more visual friendly (it feels more natural for UI development and also lots of design tools are available for tags based markup languages) with less braces/brackets as compared to Flutter or Swift UI design. Also it compiles down to render tree. even if in future that pattern needs to be cosiderd as a potential approach. devs can always write pure render trees. 3) if Blazor is used for MAUI. th .NET stack will essentially have a single consistant design model through all (Web + Mobile + Desktop) stacks. 4) Easier transition for React Native,React and other JS based stack developers.

As for my personal view. Blazor is not just about composition like React. Blazor is UI a framework. So it uses a different language which was designed for UI development and looks good to the eyes as compared to Flutter (good readability as compared to object braces/brackets).

[meisam-dehghan]

I think It'd be great for .net developers to be able to develop both web and native applications with one unified language(Razor syntax). In fact, the reason that .Net Maui hasn't lived up to the expectations of many developers somehow has to do with XMAL, which is pretty hard to work with. The way binding works in XAML has a lot to be desired for since it's string-based and most often you would have no idea whether the binding works or not until the app runs! However,Razor is a great syntax to define the UI with in both web and native apps (Blazor Mobile Bindings).I'd love to be able to bind properties of controls in a .Net Maui app like in Blazor.The way binding works in a Blazor application or any Asp.net core app with Razor syntax is a whole lot better than bindings in XAML. I think Blazor is the future,and why not provide the same model for native applications? I think thousands of web developers using Asp.net core would be encouraged to get involved with mobile developments as well if they could create a mobile app with the Razor syntax that they are already familiar with. Just take a look at the way this command in the DataTemplate of a CollectionView needs to be bound: First of all,you need to set a ViewModel as the BindiningContext and define a command (MarkAsReadSwipeCommand, in this case) , but even then the IntelliSense wouldn't pick it up! You have to enter the Path to the command as a string! Looks pretty complex,huh? To make it worse,If you made a typo, you would have no idea of the error until the app runs! Even if you define the DataType at the top of the page,the mistakes with complex bindings wouldn't be caught before runtime! **<SwipeView.LeftItems> <SwipeItems Mode="Reveal"> <SwipeItem Text="Read" Command="{Binding Path=BindingContext.MarkAsReadSwipeCommand, Source={x:Reference Name=ThisPage}}" CommandParameter="{Binding .}" BackgroundColor="{StaticResource MainColor}"/> </SwipeItems> </SwipeView.LeftItems>** So,All in all,Blazor has taken the web development world by storm since it was intruduced. Just go the same path and provide the already-popular pattern for native development as well.I have experience with developing xaml-based application dating back to Silverlight and I'd tell you from my experience that Microsoft should invest in Mobile Blazor Bindings as the future of native development,while at the same time,you could keep XAML as an option for those having developed Xamarin apps and would like to stick with that technology.

[Dreamescaper]

You can check out https://github.com/Dreamescaper/BlazorBindings.Maui for blazor syntax support.

[akhanalcs]

Waiting for this to be supported by MSFT because this is amazing!

[AmSmart]

This would really be awesome. Looking forward!!!

[danroth27]

At this point we don't have any plans to add Blazor components & Razor syntax as an alternative to XAML for rendering native UI in .NET MAUI, so we think it's time to close this issue. We already support Blazor Hybrid support in .NET MAUI to render web UI alongside of native UI. Blazor Hybrid enables .NET web developers to reuse their existing skills with HTML & C# to build native apps. Using Blazor components and Razor to build native UI has much narrower appeal: it appeals to developers that are already familiar with Blazor. For everyone else, you're now dealing with a completely new markup syntax and .NET MAUI specific components. The advantages of using Blazor native UI just don't seem to outweigh the cost of maintaining it as an alternative to XAML. We welcome any community efforts (like https://github.com/Dreamescaper/BlazorBindings.Maui) that wish to move forward with this functionality.

[jakubjenis]

While I understand the reasoning, this is still very disappointing. As someone considering what to migrate my Xamarin app to, this might be the final push to look for alternatives. When announced, I was excited to migrate to MAUI for better hot reload (getting closer to web frameworks) and new app models (Blazor / MVU) as an alternative to XAML - which for me is much less productive than alternatives. Full hot reload is not a thing outside of Visual studio for Windows, so basically non existent for iOS development, VS for MAC is gone, App center is gone, so Blazor alternative to XAML was the last hope better times are coming. Does not seem to be the case :(

[danroth27]

While I understand the reasoning, this is still very disappointing. As someone considering what to migrate my Xamarin app to, this might be the final push to look for alternatives. When announced, I was excited to migrate to MAUI for better hot reload (getting closer to web frameworks) and new app models (Blazor / MVU) as an alternative to XAML - which for me is much less productive than alternatives. Full hot reload is not a thing outside of Visual studio for Windows, so basically non existent for iOS development, VS for MAC is gone, App center is gone, so Blazor alternative to XAML was the last hope better times are coming. Does not seem to be the case :(

@jakubjenis Hot reload for .NET MAUI in Visual Studio Code is in the works.

[jakubjenis]

While I understand the reasoning, this is still very disappointing. As someone considering what to migrate my Xamarin app to, this might be the final push to look for alternatives. When announced, I was excited to migrate to MAUI for better hot reload (getting closer to web frameworks) and new app models (Blazor / MVU) as an alternative to XAML - which for me is much less productive than alternatives. Full hot reload is not a thing outside of Visual studio for Windows, so basically non existent for iOS development, VS for MAC is gone, App center is gone, so Blazor alternative to XAML was the last hope better times are coming. Does not seem to be the case :(

@jakubjenis Hot reload for .NET MAUI in Visual Studio Code is in the works.

Visual Studio Code specifically, or CLI based through dotnet watch like we have for ASP.NET? Cannot quite imagine doing XAML edits in VS Code. I could do it in an alternative cross platform IDE (that we don't mention by name) and use dotnet cli to run the app with hot reload. That would be a nice way to develop iOS apps on a Mac.