Setup
I have a series of drag and drop elements (WPF Controls) on a template. When those template elements are stacked I offer the user the ability to unstack them through the context menu. The context menu items are generated in the behind code in an extension class I created.
Problem
I would like to offer an image of the element as the icon in the context menu, next to the corresponding menu item header. Currently I have tried a series of solutions, none of which work.
Atempted solutions
How can I convert a WPF control into an image?
Get a bitmap image from a Control view
The MenuItem.Icon takes a visual object. Unfortunately when I just hand it my element, which is a visual, it bombs because the element is part of another visual tree.
So I tried cloaning it and then providing it the same DataContext. Which worked, kinda. Without going into to much depth, the size of the element is bound to the datacontext so it's VERY difficult to adjust the size from the behind code without it looking like a giant hack.
Desired outcome
I want to render an image of my WPF control and assign that to the MenuItem.Icon property. Also I need to be able to do this in the behind code.
To get an image of a control, you can do using a VisualBrush, with Visual bound to the control. An example of this with transforms (stretching, etc) can be found at MSDN here.
Related
I currently have an application that uses a ToggleButton/Popup feature and it all works as expected, but I wanted to see if there's a way (either through control templates or custom controls) that allows the toggle button to be included as part of the popup window.
The effect I'm going for is similar to the standard TabControl/TabItem layout but instead the ToggleButton would replace the header of the TabItem and the Popup would serve as it's content.
In the end, I want to have the Popup window display to the immediate right side of the ToggleButton and have one continuous border that wraps around the outside edges of the ToggleButton and the outside edges of the Popup window with no border inbetween. The final appearance would show no separation between the two controls, and the user would perceive the ToggleButton and the Popup as a single control object.
I was thinking it might be possible to edit a template of a standard TabItem and have it's content property display as a popup, but haven't tried it yet.
Let me know if you think this is the way to go or if there's any other potential solutions. Thanks.
Almost everything in WPF can be done in multiple ways. The same is true with your goal.
If you plan on reusing this control in multiple places, I would suggest building it as a custom control. I build custom controls and UI libraries for a living, so I am a bit biased.
I would build a custom control that inherits from HeaderedContentControl. The Header property is the content of your ToggleButton, and the Content property would be the content of your Popup. Since you own the ControlTemplate and code, you can make it look and function exactly how you need it to with no compromises.
In the form pictured below, the entire content of the right side changes when an item is selected on the left side. Which control can I use to accomplish this effect? I’ve tried a ListBox if anyone can put the code or the design tools .
Picture of form:
The left side is most likely a Win32 TreeView control. The pane on the right is almost certainly a ListView control.
There's really nothing that will automatically swap the views out when you click on the tree control. You'll have to write you own code to toggle the main pane's view based on the item selected in the tree.
I'm styling WPF's Calendar control and I've reached a point in XAML where there's a grid with no elements in it, just divided by rows and columns where the day numbers are.
I've snooped and decompiled (void PopulateGrids()) and have learned that in code-behind the Calendar is creating CalendarDayButton and feeding it to the grid.
I need to change the style/theme in-order to change the colors (of those CalendarDayButton) and I'm not sure how to do that.
I've tried applying a style to all CalendarDayButton in said grid, but that didn't work.
Any suggestions?
P.S. I'd rather stay away from code-behind because what I'm working on is a style in a resource-dictionary and not a user-control.
Go to the Microsoft page for Calendar Styles and Templates, copy the style code into your resources block and make changes as needed. If you need to create additional properties for settings etc then you can do so with an attached property, that way you don't need to create a new calandar control. If you're having difficulty figuring out which parts of the template correspond to things you're seeing on-screen then put a breakpoint in your code somewhere, add the calandar control variable name to your watch window and click on the little magnifying glass to bring up the WPF visualizer...that will let you traverse the visual tree and visually see which part of the control each section is rendering.
He I am a beginner to C# and I am working on a reaction manager plug-in for some bigger project. (Yes I am a intern)
Now I just can't find a way to create a view similar to this:
My full design:
How to realize this design? I cant find any default templates in the devexpress which are suitable for this. I come from php and in php I can use html. I am a beginner to C# and I don't have any clue on how t do this. Do I have to use canvas to literally draw this? OR is there a standard template I can use for this purpose.
You have many comment boxes that contain the same layout - a label comment text, author name, date, etc. There is no control that lays things out like that, you will have to make your own custom control (Project->Add User Control). This control will be a composite control - ie made up of other controls. Probably a label for each text field (comment, author, date, etc) laid out in the right places. Maybe call it CommentBox or something.
Then in the main form you now have available CommentBox controls which you can add to the form. Create a panel to put them in so you have many CommentBox controls in the panel, one for each comment (or maybe add them at runtime).
Now in WPF it's slightly easier because there is a StackPanel control that you can simply add controls to and it automatically arranges them vertically one beneath another in a stacked list. In fact your use case is exactly fitting what a StackPanel is for.
In WinForms there is no StackPanel, but you can use a normal Panel control*. It's just you'll have to position the CommentBox controls manually one beneath another. You will also need to set the AutoScroll property to true to turn on the vertical scroll bar if the content doesn't fit the view.
*or there's apparently an alternative How can I get a StackPanel-like layout in WinForms
Previously I tried to Drag and Drop an object out of a LibraryContainer onto a ScatterView and vice-versa and it was rather simple being that the LibraryContainer, LibraryStack and LibraryBar support drag and drop events by default. That combined with the DragDropScatterView.cs from the ShoppingCart example provided with the Surface 2.0 SDK was pretty straightforward.
Now I want to be able to drag and drop a UserControl onto a ScatterView4 and vice-versa, i.e., something like this: http://goo.gl/zZIdg.
From what I researched there is a way to do that and can be found here: http://msdn.microsoft.com/en-us/library/ff727736.aspx. However, here they don't use the DragDropScatterView.cs, it's done a different way. You have two ObservableCollections (a source and a target), the ScatterViewItems and the SurfaceListBox.
One thing I don't like in this example is that the ScatterViewItems that can be dragged don't really have a scale property because when the user clicks on the ScatterViewItem, it creates a visual style and hides the ScatterViewItem and when you drop it, it updates the coordinates and orientation of that ScatterViewItem and makes it visible. I decided not to go this way, since I want a normal ScatterViewItem behaviour.
The basic thing I want to do is to have, for example a Label, and on the side a ScatterView and be able to drag that Label (creating a visual cursor - already done) and drop it on the ScatterView, creating a ScatterViewItem that has the same properties as the original Label. I tried doing this with the DragDropScatterView.cs but when I'm using a Label my droppingCursor.Data (on the DragDropScatterView.cs) is null and I think that happens because the draggedElement.DataContext (on the LabelView.xaml.cs) is also null, however this is not null when I have a SurfaceListBox.
I provide a code sample here: http://sdrv.ms/VDuHq5. In the SurfaceWindow1.xaml there is the TagVisualization and the container of the ScatterView, the LabelView.xaml is called inside the `TagVisualization.
If someone can help me on this I would really appreciate it.
I managed to solve my problem and here is a brief explanation on how I did it:
I searched and found this. I then used this SurfaceListBox with these drag and drop events and combined it with the DragDropScatterView class, so each time a new ScatterViewItem was created I would have a normal ScatterView control of my custom object. With this method you also have to create a Visual Cursor, i.e., what you'll see when you'e dragging the item from the SurfaceListBox.
The thing that was puzzling me and that Serge Calderara (from the MSDN Surface Forum) helped me with, was that I kept trying to associate these drag and drop events to a Label for example, or a UserControl even, but I was looking at things the wrong way. In most cases the best solution for you is to have a container, and in that container you put the UserControls you want and you only associate the drag and drop events to that container, and not to each individual item. With that in mind it was rather easy to put things together, I created my UserControls and populated the SurfaceListBox (wich is my container) with an ItemTemplateSelector and I used that same Selector for the ScatterView (that's receiving the items from the container). In my object class I just defined a variable to save which type of UserControl I'll have and return the DataTemplate accordingly.
With this I created a SurfaceListBox with two custom UserControls that I can drag and drop to a ScatterView and back. A working sample with MVVM pattern can be found here: http://sdrv.ms/10SjKaH.
I hope it can help others and it helped me. If you have any questions or suggestions please feel free to ask/tell.