VS 2022 Preview not showing the XAML designer - xaml

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.

Related

Understanding how Cross-Platform App starts and uses xaml pages

(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."

UWP: VS Designer Error when DesignViewModel is inheriting from reactiveui's ReactiveObject

Dear C# reactiveui community,
I am currently developping a UWP-App. To connect the UI with my BusinessLogic, I am using reactiveui in my ViewModels.
However, the VisualStudio designer keeps telling me that there is an error in my XAML when I set the DataContext or the d:DataContext to a ViewModel that extends ReactiveObject.
I keep seeing that nasty prompt to check for errors in my XAML code. The spot where I set my DataContext is underlined.
I am running Debug x86, targetting Build 10240. Experimenting with other Build targets or switching to Release did not help. To make use of the designer, I have to switch to x64 because there are no design instances in x64. That is an unacceptable solution, however.
Anybody who can help me with that issue? Thanks in advance!
I can't help with the ReactiveUI issues, but for Visual Studio 2015 you can now toggle the designer so that it does not run code in design mode. We enforce this when you switch to X64 or ARM as targets (since we can not run that code on X86) - which is why the designer then functions.
You can also toggle to 'no project code mode' using the icon next to the zoom control under the designer. Click this icon and VS2015 will no longer run code in the designer and will also show placeholder data for your bindings. Let us know if this feature helps you.

Reason for toolbox items being greyed out [duplicate]

I'm trying to add a chart to my Visual Studio form but the button is greyed out. I'm using .NET Framework 3.5 and C#. Following instructions online I've downloaded and installed the dll files from this link: http://www.microsoft.com/en-us/download/details.aspx?id=14422
I also added them as references and added the following line at the top of my form file:
using System.Windows.Forms.DataVisualization.Charting;
but the button is still greyed out.
What have I missed?
To make the chart control available, you need:
To be using .Net framework 4.0 or higher, OR for .Net framework 3.5 install this: http://www.microsoft.com/en-us/download/details.aspx?id=14422
On the toolbox context menu -> Choose Items... have the Chart control selected. (Sort by name in the Choose Toolbox Items dialog and scroll to Chart. There are two: one for Windows forms, one for Web forms. You need only select what's relevant.)
The chart control appears in the "Data" section of the Toolbox.
You do NOT need to any any "using" clause to the form source file, or any reference in the project references. (The reference is added automatically for you when you add the control.)
I too had this issue and could not resolve it for hours.
As posted here:
Visual Studio 2010 toolbox controls disabled or inactive
In order to solve it for me I just right-clicked one of the items in the toolbox, and chose "Reset Toolbox"
This resets the entire toolbox, so as mentioned in the answer above, all custom tools are lost and need to be re-imported.
Had the same problem.
What I did was to make sure that I was using the same Framework with the chart framework version.
During project creation, by default using .net 3.5. But since the chart is written for Framework 4.0, it will not work with 3.5.
You need to change the solution or project Framework to 4.0 or above by doing this:
On the menu bar of Visual Studio, click <your project name>/Properties.
Change target framework to 4.0 or above.
Save the properties setting.
Rebuild your solution.
After this, you may use that chart component.

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

How to set default XAML view in Visual Studio 2008

In Visual Studio 2008, when you add a new XAML window to a WPF Application Project, the default view you get is "split view" where the visual designer and the XAML code are shown one above the other in the same document.
I prefer an alternative view which you can get by double-clicking on either the Design or XAML tabs. The visual designer and the XAML are in separate side-by-side tabbed views. This makes it easy to switch between them
I want to know if it possible to make this the default view for all new XAML documents I add to my project, and where in the options you would set it.
Tools/Options/Text Editor/Xaml/Miscellaneous, check the "Always open documents in full XAML view"