Understanding how Cross-Platform App starts and uses xaml pages - xaml

(I have experience with MVC, WebForms, WinForms. I am getting started with Cross-Platform App projects.)
I created a Cross-Platform App project including Xamarin.Forms.
Visual Studio created 4 sub-projects:
"MyProject"
"MyProject".Android
"MyProject".iOS
"MyProject".UWP
I suppose that I actually have to develop most of my project in "MyProject" except for UI specifics things?
Then I have two questions:
Where is it written in "MyProject".UWP that it has to display "MyProject"\MainPage.xaml?
Why can't I view "MyProject"\MainPage.xaml in designer mode?

I think I found both aswers:
Where is it written in "MyProject".UWP that it has to display
"MyProject"\MainPage.xaml?
Somewhere in "MyProject".UWP\MainPage.xaml.cs is the line MainPage = new MyProject.App(); and in "MyProject".UWP\App.xaml.cs is MainPage = new MyProject.MainPage();
(For those not used to work XAML files: the .cs code can be viewder click on the arrow left to the XAML file.)
Why can't I view "MyProject"\MainPage.xaml in designer mode?
According to https://developer.xamarin.com/guides/xamarin-forms/troubleshooting/questions/forms-xaml-designer/
Possible answer: "There is not yet a visual designer for generating XAML in Xamarin.Forms applications, so all XAML must be hand-written."

Related

Where did XAML Designer go? (Visual Studio 2022, C#, WinUI 3) [duplicate]

I was developing uwp apps for the past few years, now moving to winui3. It is my first project. I am unable to find the designer view for the XAML files. Is it not available in WinUI3? or something else?
Unforturnately Designer View is not supported for now in WinUI3 for XAML files. You can track its status on Github:
https://github.com/microsoft/microsoft-ui-xaml/issues/5917
https://github.com/microsoft/microsoft-ui-xaml/issues/3656

VS 2022 Preview not showing the XAML designer

I've just installed VS 2022 preview to use Maui but there seems no way to see a designer view of the XAML, I want to drag and drop controls onto the page but all I get is an ancient looking XAML text view.
Visual Studio has removed the XAML designer. For now, there is no official plan to readd it.
But Visual Studio support Hot Reload to modify your apps managed source code while the application is running, without the need to manually pause or hit a breakpoint. You could preview the view at runtime when you change the UI. For more details, please check the blog. https://devblogs.microsoft.com/dotnet/introducing-net-hot-reload/
Like Cfun said, you could use live visual tree as well. It shows a tree view of the UI elements of your running Xamarin.Forms application. https://learn.microsoft.com/en-us/xamarin/xamarin-forms/xaml/live-visual-tree
For a WPF dotnet6 project, the XAML designer can be enabled here:
Don't know why it's disabled by default.

Where is the designer view in WinUI 3?

I was developing uwp apps for the past few years, now moving to winui3. It is my first project. I am unable to find the designer view for the XAML files. Is it not available in WinUI3? or something else?
Unforturnately Designer View is not supported for now in WinUI3 for XAML files. You can track its status on Github:
https://github.com/microsoft/microsoft-ui-xaml/issues/5917
https://github.com/microsoft/microsoft-ui-xaml/issues/3656

Vb.net Mobile Application

I've been assigned a school project in which we're asked to develop a survey app for device/mobile use using VB.net.
I've started learning some Visual Basic, yet I'm failing to understand the following. I've downloaded Visual Studio 2017, do I need to download something extra so that I'm able to program for a mobile device? Or what is it that I need to do? I'm quite confused, I'd really appreciate some sort of help with understanding what's going on. I've been searching on the Internet quite some time now, and all I've found is "Visual Basic for Windows Phone Developer Tools - RTW", which is a version for 2010 and I'm not quite sure if it's what I need anyway. Another thing I've found is Xamarin.
Any help will be highly appreciated and excuse me for such a dumb question.
You're probably looking for Xamarin. It lets you use C#, F# and VB.NET code to develop cross-platform apps including native apps for iOS and Android.
Note that Xamarin doesn't completely or directly support VB.NET. You'll have to do the following steps to get started:
Create a new C# solution of the type Mobile App (Xamarin.Forms). You need to have the Mobile Development with .NET workload installed for this.
In said solution, add a Visual Basic .NET Class Library (.NET Standard). After creating the project, right-click it, click Properties, and change the Default Namespace to match the existing C# project(s).
Right-click the VB.NET project again, click "Manage NuGet Packages", then install Xamarin.Forms.
After this, you will want to rename Class1.vb to App.vb. Paste the following starter / example code there:
Imports Xamarin.Forms
Public Class App
Inherits Application
Public Sub New()
Dim label = New Label With {
.HorizontalTextAlignment = TextAlignment.Center,
.FontSize = Device.GetNamedSize(NamedSize.Medium, GetType(Label)),
.Text = "Welcome to Xamarin.Forms with Visual Basic.NET"
}
Dim stack = New StackLayout With {
.VerticalOptions = LayoutOptions.Center
}
stack.Children.Add(label)
Dim page = New ContentPage
page.Content = stack
MainPage = page
End Sub
End Class
Update the Android and iOS projects so that they reference the Visual Basic .NET project(s), rather than the C# project created by the template. Right-click on the References node in the Android and iOS projects to open the Reference Manager. Untick the C# library and tick the Visual Basic .NET library instead. Do this for both iOS and Android. Finally, delete the C# project. You can now develop your Xamarin project in VB.NET by adding more .vb files as necessary.
Unfortunately, VB.NET has a few limitations in regards to Xamarin:
You can't write custom renderers or dependency service implementations in VB.NET. These must be written in C# or F#.
You can't include XAML pages in VB.NET projects. You'll have to use a workaround that involves including XAML pages in a seperate, C#-based, portable class library, referencing it, and populating the XAML models with VB.NET through databinding. Alternatively, this may be of help for using XAML with VB.NET.
More info can be found at Microsoft's website.
I know this question is three years old, and that lots of time has passed since that school project, but I hope this answer was helpful to you regardless, and / or that it will be helpful to others who have the same or a similar question. To anyone about to write Xamarin apps in VB.NET or who is currently doing so, I wish you the best of luck!

Inspecting XAML in Windows 8 Store Apps / VS2012

I'm looking for a way to inspect running XAML in a Windows 8 store app. Essentially, I want firebug / chrome inspector style functionality where I can look at the XAML source generated at runtime, to debug simple layout and style issues.
I've tried Snoop, Pistachio and WPF Inspector but none work for Windows Store apps. The only one I can find which seems to work for Store apps is XAML Spy, which is €90. I can't justify that cost.
Is there any other way to inspect running XAML?
WinRT XAML Toolkit now has an actual visual - visual tree debugger.
Get it from NuGet: nuget.org/packages/winrtxamltoolkit.Debugging then call WinRTXamlToolkit.Debugging.DC.ShowVisualTree() to display the debugger tool inside of your app. It's the third option so now you can use
the WinRTXAMLToolkit.Debugging.VisualTreeDebugger class - that enables you to debug the tree in your Visual Studio
XAML Spy - which is a great commercial visual tree debugger that runs in a separate window
and now this visual tree debugger in the WinRT XAML Toolkit that works inside of your app.
The VisualTreeDebugger class from WinRT XAML Toolkit is what you could use if you want a free tool. It doesn't do as much as XAML Spy, but you get what you pay for. I thought of adding more features to it like actual visualization of what you debug, but the work required would not justify the time investment + I didn't want to step on Koen Zwikstra's turf. I am sure he is doing a great job on that tool. Anyways - VisualTreeDebugger is enough for me, so maybe it would also be enough for you.
The way you can use it is add the class to your code, add a reference in your XAML like
xmlns:debug="WinRTXamlToolkit.Debugging"
then put a hook on a control where you would like to start debugging, like
debug:VisualTreeDebugger.BreakOnLoaded="True"
which will dump the core visual tree details as text in your debugger output window (Ctrl+W,O) and break in the code that dumped your tree where you can investigate the "path" variable, which contains the list of all visual tree elements from the debugged control to the root, so you can watch their values if what you need wasn't already dumped in the output window.
Other options include
debug:VisualTreeDebugger.BreakOnTap="True"
debug:VisualTreeDebugger.BreakOnLayoutUpdated="True"
debug:VisualTreeDebugger.BreakOnLoaded="True"
debug:VisualTreeDebugger.TraceOnTap="True"
debug:VisualTreeDebugger.TraceOnLayoutUpdated="True"
debug:VisualTreeDebugger.TraceOnLoaded="True"
Since it is source code and really a single simple class - you can easily add additional things to the code to do any custom debugging you need.
XAML Spy is what you need. You find it at http://xamlspy.com.
there is a new free tool called XAML Inspector. It's available through NuGet. Just search for "xamlinspector" or get if from the project page: www.xamlinspector.com
Greetings
Christian