I'm an experienced C++/Qt developer but a newbie C#/WPF developer, and I'm wondering if I'm missing something with the Visual Studio 2010 WPF designer.
In Qt, all widgets have a parent. I found this concept very useful both when building GUI programmatically and in the designer. From what I remember from Qt desginer (unfortunately my new company doesn't support Qt), you could easily drag widgets around and they get re-parented correctly. If the designer somehow got confused, then you could just reset the parent to whatever you needed in the properties box. I find the analogous ideas in WPF difficult to execute.
In the Visual Studio Designer, when I drag widgets around, they only sometimes get the right parent. More often than not, I have to go to the xaml and cut-and-paste the widget I was writing into a different part of the xaml so that it gets the right parent. I understand that the DOM tree of xaml nicely parallels the widget parent tree, but I found that was much more explicit in Qt.
So, my question is: is this cut-and-paste approach to re-parenting in WPF xaml the best you can do or are there some nice designer tips-and-tricks that I am missing?
Note: this question obviously doesn't apply when building GUI programmatically.
In my experience this boils down to a lacking designer in VS2010. Personally I use the designer for WPF as a view on how the GUI will look, and then hand code most of my XAML. I almost never actually DO anything in the designer such as drag an element or such.
To answer your question, the cut-paste in xaml approach you mention is in my experience the most efficient way to "re-parenting" elements.
Related
I'm new to the Windows world, and I think I'm getting lost in the weeds on a problem. I'd love some advice from people with experience with C++/CLI and WPF and XAML.
I have some win32 code, and I need to run a WPF GUI. I found this MS walkthrough sample, which uses C++/CLI. I adapted it to my purposes, and it works great.
Next, I wanted to rip out the programmatic WPF stuff and use XAML instead. This is so I can hand off the XAML to a designer person and take myself out of the UI design loop, where I most assuredly don't belong. After reading the "WPF Interoperation Projects" section of WPF and Win32 Interoperation on MSDN, I decided to go with the XamlReader::Load option and load uncompiled XAML at runtime. My XAML markup is a Canvas UIElement which I programmatically add as a child of my root Grid C++/CLI element. This works great.
Now I want to add event handler to controls in the XAML. This is where I have started to run into trouble. I'm sure that my general ignorance of the Windows world is 95% of what's killing me here.
I started with Rob Relyea's page outlining the various XAML-and-event-handler options.
I decided to try compiling the XAML as a C# DLL. It's basically the same XAML as what I used in the runtime Load case. I instantiate the object and programmatically add as it as a child, just like before. But ... I get nothing but a black window. No exceptions get thrown either. I'm baffled.
My question is, am I even headed down the right path? The page on XAML-and-event-handlers says you can use event handlers defined in uncompiled XAML in .Net Framework 4. Should I bite the bullet and just go to VS 2010 (I'm presently on VS 2008) so I can use .Net Framework 4 and just stick with uncompiled XAML? Are there any gotchas with doing things that way?
Or, if you do think the compiled C# DLL is a reasonable path, do you have any ideas on how I can debug the problems I'm having?
Or, is there a better and completely different approach?
Thanks in advance for your advice.
Polly
I think the right answer for this depends on some issues that only you can decide, but I'll start with the assumption that your C++ code base is big and complex enough that it is worth preserving.
Beyond that the next decision point is do you have UI (perhaps GDI) code in the C++ your preserving or only non-UI code. If you are attempting to preserve only non-UI code then I would consider pushing more UI responsibilty into C#. Perhaps you go so far as to build your views, event handlers, and maybe even view models in C#. This will enable you to take better advantage of the VS tooling.
If you've got extensive UI code in C++ to preserve then your current path makes a more sense. I don't think it will be impossible, but you'll have quite a challenge ahead of you. The key example here is Visual Studio 2010. It is the premiere example of a mixed application and has GDI and WPF side by side unlike any other app I've ever seen or heard of. There is a series of blog posts that I found pretty interesting that describe some aspects of what the Visual Studio team did to achieve this integration at The Visual Studio Blog.
I also came across this video Henry Sowizral on Refacing C++ with WPF in Expression Design that I have not seen myself, but discusses putting a WPF UI on top of an existing MFC C++ app.
Good luck.
I don't have any specific advice on the first part of your question other than to say that putting more responsibility in C# would allow you to build a small stub app if necessary which could go a long way toward diagnosing problems.
Thanks to everyone for the responses. On the matter of getting stuck on the C# DLL, I found this C++/CLI sample: http://msdn.microsoft.com/en-us/library/aa970266.aspx. Using that, I found my error, and was able to load the WPF without problems.
However, the whole motivation for loading the C# DLL was that I had understood that that was the way to attach event handlers programmatically. Following AresAvatar's suggestion, I found that I could use FindName to attach the handlers -- both within the C# DLL, but it also worked with my original loose-XAML approach. So, I didn't need the C# DLL after all!
It's all working nicely now. Again, thanks for all of your help and suggestions.
I created a form in WPF and it looked great. When I opened it in Visual Studio 2010, it look alot different than what I created.
Any ideas why this would happen? Should I ignore how it shows up in VS? This makes me wonder if either is how the user will actually see it.
Any suggestions?
Thanks again!
Eroc
The Visual Studio view of your WPF form is the designer view. Designer views of WPF forms, or really any other design of a UI component, will often differ in dislpay vs. the actual running component. Some of these differences are intentional to make design easier and some are just limitations of not having the WPF element actually running in a program (lack of certain runtime data bindings for example).
I wouldn't worry about it unless it starts looking incorrect when running.
I was wondering how programmers chose to edit XAML. Most of the programmers I speak to seem to edit the raw XML, but that seems nuts to me since it is such a natural thing for a more visual editor (of course you often have to get down to the raw code ultimately, but isn't there a better way to lay out a grid, or edit a template, or add non c# triggers or manage commands? The one that really set me off was editing a menu -- Visual Studio 1.0 had a better menu editor for C++ than the raw XAML editing experience.)
When I edit .aspx files I use a visual editor much of the time, and then for the raw stuff I get into the html code.
I am aware of Expression Blend, but that seems far more focused on artistic types and GUI experts rather than programmers.
Does anyone have recommendations for a better editor for XAML than VS? Especially so since VS seems to have real nasty problems with XAML editing too, like bugginess and poor performance?
Appreciate your helping this XAML newbie.
I must agree that Blend has the best XAML editor I've tried. While VS2010 has made some significant improvements over 2008, it's not at the same level as Blend, and still feels a little clunky and is prone to freaking-out.
A good option for doing quick and dirty XAML editing is Kaxaml, a small editor which can be thought of as NotePad for XAML. It's fast(er than VS), has syntax-highlighting, auto-completion and an in-editor preview. I find it quite useful to use alongside VS, although it is limited for serious work.
The Visual Studio 2008 visual editor for XAML is still fairly primitive as you've encountered. When it comes down to wanting a true visual editor for XAML files, Blend is your best bet.
Like you, I originally thought Blend was targeted more for designers, but after using it for awhile now, I've found that Blend is clearly the best tool to visually edit XAML files. And since Blend integrates with Visual Studio Team System, you are able to switch between Visual Studio and Blend fairly seamlessly.
I use Blend when I'm doing visual tweaking or setting up Storyboards. I'll sometimes use it when first laying out a window, as well, but I've found that it's often easier to just hand-code the XAML rather than relying on Blend to guess the layout I want. I use Visual Studio when I'm doing XAML editing by hand, as it has better Intellisense and automatic formatting than Blend. I never use the visual editor for WPF in VS.
Part of the challenge here is that XAML layout is much more sophisticated than WinForms, so simple drag and drop doesn't quite cut it anymore. Blend does a pretty good job of guessing what I want, but if I really want to clarify how the visuals should be laid out, it's easier to express by typing the XAML, now that I'm familiar with it.
My typical workflow:
Create the initial layout by entering XAML in Visual Studio for the Grids, StackPanels, DockPanels and what have you that will lay out the window or control. I may also drop in some of the other controls as well, if the layout is simple.
Open up Blend and use it to place smaller controls, edit control properties and create/associate any styles I need. If I need custom control or data templates, I'll create them from Blend and then repeat the VS/Blend process on those templates.
Go back to VS and edit the XAML to set up my designer data context and manually code the data bindings.
Use Blend to verify the look of the finished window or control with the designer data context, tweaking and styling as needed to polish the UI.
I go back and forth a lot, but I'm typically also approaching it from a different mindset with each tool. If I was working with a larger company, I suspect most of what I do in Blend would be handled by a graphical designer, which is I think the intention. I don't mind wearing both hats, though and I've become accustomed to using both tools, as needed.
Visual Studio 2008 isn't the tool to edit WPF window. It falls in error usually if you uses a complex xaml type or some advanced styles.
Visual Studio 2010 has added a lot of new features in editing and specially designer for binding and IntelliSense for xaml too.
Blend is true that is oriented for designers like Microsoft want to sell it but I find it more like the missing feature of the designer of VS.
Blend has an advanced editor for styles and animation and helps a lot to generate.
But Blend lacks terribly in editing raw XAML, it has no IntelliSense at all.
My choice is to use both VS 2010 and Blend specially for styles and animations.
Expression Builder is a good free tool
All I want to know is if there's an easy way to add lines that connect nodes in a WPF TreeView, in the same manner as Visual Studio 2008's Solution Explorer pane. I found one solution but there's a lot of code and I want a simpler way. A thread on Microsoft's Silverlight forums seems to suggest that the lack of a "lines" option is due to Silverlight compatibility.
That's pretty much the only way. You need to modify the ControlTemplate of the TreeView and to do so you need to meet the requirements for the TreeView to draw itself (which is all the extra code). I REALLY suggest you get used to ControlTemplates if you'll work with WPF, since it's a very powerful feature. Basically they did it this way to separate design from functionality.
I've been doing WPF applications with the MVVM pattern using Visual Studio, coding C# and XAML mostly by hand.
Now I've gotten up to speed with Expression Blend so that I can click together WPF applications quickly just using the GUI, which is very nice, much more control of the layout than fiddling around with all the XAML elements 80% of your time.
But it seems that my applications in Expression Blend are simpler and necessarily coupled, using events that are handled in the code behind, etc.
I find it hard to imagine how I would go from this simpler approach of Expression Blend to a decoupled MVVM application with Views, ViewModels, routed events and commands, etc. other than to just take my whole project into Visual Studio and rearrange it to the point that I couldn't really edit it visually anymore in Blend, but would be back to using Blend to create little pieces of XAML that I paste into Visual Studio.
For those of you who are working with more complex applications with Expression Blend, what are your strategies for keeping your projects decoupled in an MVVM way, yet at the same time structured "in the Expression Blend way" (where you can still see and edit whole parts of your application in a way that makes sense visually) so that you can continue to edit them in the Blend GUI as they scale?
I've been using Blend first and foremost as a rapid-prototyping tool. For this purpose, I really like it. In particular, I find it very helpful when I'm not sure how to set things up to get the layout/behavior that I want.
I rarely edit my main project files directly in Blend. I find it creates markup that is unnecessarily complex or verbose. Also, as I become more familiar with WPF/XAML, I find myself using Blend less and less.
I have been using Blend for the UI of my projects since version 1. Being that my goal is to fully integrate the designer to the project, I have plowed through whatever gets in the way of this goal. While not being aware of MVVM for some time now, I naturally arrived at the same conclusion, and have been making ViewModels without knowing there was a pattern for them. Now with the help of others that are working towards MVVM, it's getting better all the time. I have now developed 3 applications with rich UI and functionality where all the UI was done in Blend.
Read Josh Smith's MSDN article, look at Jason Dolinger's work, and Karl Shifflett's work to mention just a few.
Look closely at using ICommand, INotifyPropertyChanged, the ObservableCollections.
Also, look for how you can manipulate controls from your ViewModel. As an example, there is ICollectionView. Assume that you have a list of animals, and you have a set of types that you want to filter them by (birds, mammals, etc.)
By using ICommand and ICollectionView, you could expose enough control where a designer could construct a listbox to show the animals, and a menu to show the filter list. There is enough functionality in ICollectionView to know what the current selection is, and if you had ICommand-based commands for "SortByBird", "SortByMammal", etc then when the designer made the menu, it (assuming the window's context was your ViewModel for this window) would supply the designer with the proper options to bind to.
I am currently working with another team at my company explaining how my projects have been set up, and they are responding positively to the new role of the designer using Blend.
I have not been able to successfully use Blend end to end for that.
I find in the general case, it's faster to edit xaml by hand in VS (exception would include anything with non-standard brushes for example). Blend is very click-happy, and it's not really fast to top it off.
Another area where Blend is really useful is creating styles/templates from existing controls.
Other than that, I'm not sold yet. Its capabilities drop when using code-instantiated datacontexts so it's no help there, and it tends to generate useless markup, static sizes and such, which I really don't like.
Blend is great for giving you an idea about how things can be done, but the xaml it makes is terrible and tightly coupled. As you learn the xaml side of things better you'll find it's much faster to just write the xaml than use Blend. Until you get to that point you can make your changes in Blend but then you should refactor the xaml it creates to make it less tightly coupled and take out the extraneous UI elements.
I'm a little late to this party, but hope that someone can still respond. I've yet to find a search result that outlines the process for drawing a line between the designer and programmer. The first part of it is MVVM so there isn't any coupling between the GUI and the underlying "business logic", and I'm working hard on learning that right now. The other part that I haven't seen anyone write about is, how do you actually go about designing a project in Blend so that the developer can basically give you a GUI DLL of sorts, and then your application's GUI magically changes?
Here's what I'm looking for -- the developer writes his code as usual, and also writes a very basic GUI that proves everything works as expected. Meanwhile, the designer is creating his cool little GUI with all of the usability features people have come to expect. Now, the developer can run his application with his GUI, but then can also switch to the designer's GUI on the fly.
I guess if it can't be done on the fly, does that mean in the ideal case that the developer would have his VS solution include the XAML from the Blend solution? Then in App.xaml just reference a different start file?