I don't seem to find an answer how to make reusable path-icons in wpf. I suspect that my problem is the same with using Image visuals instead of Source but can't figure out how to fix this for Paths.
I have a tab control with separate custom controls in the tabs. Each of them have buttons with 'path' content.
<Button Style="{StaticResource ButtonIconStyle}"
Content="{StaticResource RefreshIcon}"
Command="{Binding RefreshCommand}"/>
Where icon is:
<Path x:Key="RefreshIcon" Stretch="Uniform"
Fill="{StaticResource ButtonIconColor}" Data="..."/>
I need this Uniform stretch so I also tried ViewBox, but that didn't help.
The first tab with this icon I open is shown normally (it can be any tab, not first in tabcontrol). But after switching to another tab with the same defined button and switching back to prev tab the icon in the first one is no longer visible. It happend only with icons that are the same (if icon is not present in the second tab it will remain visible).
What can I do about it?
Btw my Buttons are styled, but the same thing happend when they were just simple rectangular buttons with path content.
The problem is that your path is referenced using StaticResourceExtension in multiple places (by different instances of Button). Since Path is a FrameworkElement and it can only occur once in the visual tree, what happens is if you load the second tab (thus loading the Path into this tab, it gets unloaded from the previous tab (to satisfy the said condition). Observe that it will always be visible in the last tab selected.
In order to resolve this problem you need to set x:Shared="False" on your Path in the resources dictionary - this way whenever it is referenced using StaticResouceExtension a copy will be returned rather than the actual instance from the resources dictionary, each of which will be loaded and stay in the visual tree as expected.
Related
I want a button that
Displays an image with NO border, NO background, NO text
If I tab into the imagebutton, THEN it shows the background and border
Also if I hover over it, it shows the background and border
I've searched and I've tried so many different things, but nothing it exactly what I want. I've tried setting various properties on the button to make the background and border transparent, but it still shows up. I've tried a style with a custom control template. I'd rather not have to completely reinvent all the triggers etc to get the button to render on mouse over. The biggest problem with custom control template is that then I loose all existing functionality and I'm basically building a new control from the ground up.
Here is another link that came closest to what I wanted but it doesn't properly work for me.
How do you completely remove the button border in wpf? - BUT.... for some reason the hover effect gets stuck. One I mouse over the image and the button border draws, it stays stuck on until I click somewhere else.
Actually, you will want to override the control template. You're not "losing" any functionality (aside from the UI triggers).
Original/Default Template -- This is a good starting point... copy/paste that into you're XAML (wherever you want to style this button... ie Button resources, UserControl/Window resources, App Resources?). From there make your adjustments.
Another easy way is to use Expression Blend. You can easily create a new template based on the existing template, and the styling/authoring tools it provides are much better than hand-coding XAML (unless you're good at doing that).
As far as displaying an image instead of text, just set the image as the content. A Button is a type of ContentControl which means that it can house any type of content (Object).
I have the following code inside a RibbonSplitButton (which rendered correctly on the 3.5 ribbon CTP verion). I tried to view it using the WPF Ribbon 4.0 library, but it's just not rendering the Icon. Any idea why?
<ribbon:RibbonMenuItem Header="Option 3 - icon">
<ribbon:RibbonMenuItem.Icon>
<Image Width="16" Height="16" Source="Images/wizard-icon16.png"></Image>
</ribbon:RibbonMenuItem.Icon>
</ribbon:RibbonMenuItem>
Don't use the Icon property, that is inherited from MenuItem, and isn't used by the Ribbon control. Use the ImageSource property instead.
I also see the same problem. I've try to put even simple text in the Icon property but it just does not show anything.
I've check the control template and there is just no binding to the Icon property in it. You can use ImageSource to put an image in the menu item icon's place.
I guess it simply bad control template.
Add a forward slash in front of Images and do a Rebuild Solution. This is assuming the Images directory is located at the root of your project.
Is the image's build action set to Content?
HTH
Try setting the image's build action to Resource
First of all, I do not feel completely educated on how to navigate between multiple "pages" of a window.
For example, I have a Window called MainWindow. Inside of this, I have a header and a footer. In the middle is a panel which contains content.
This panel will originally contain content A. Upon clicking something in A, I want to remove A from view and show a new panel with content B. However, I want B to be shown in the same window (i.e., not hide the window and open a new one). Is hiding/showing these panels the correct way to go about it?
If using the panel switching mechanism is the correct way, then I am worried about resource management. If I set panel A to not be visible, and panel B to be visible, will I still have resources from both panels loaded? If I have a large number of panels to switch between, I would not want to load content for all of them, but rather the active one.
How would I go about making sure that I am correctly handling resources and memory between these different views?
If I have the completely wrong idea about how to switch views within a single window, please let me know.
Thanks.
Instead of toggling visibility off and on, you should put a contentControl and switch it's contents to different UserControls.
That way there's no reference to the UserControl that's offscreen, and you can handle memory issues better.
One alternative is to just use a single ContentPresenter, and put your individual "panels" in there, but only one at a time.
Instead of flipping visibility, you could use Data Binding to change the bound content within the ContentPresenter. This would only leave a single "view" in place at a time, preventing the neeed for "a large number" of panels to be loaded.
I'm using "Microsoft Ribbon for WPF" and creating multiple RibbonTab. I cannot figure out a way to view/focus different tabs in the designer and it by default show the "Home" tab. To see design/xaml changes I made to tabs other than the "Home" tab, I have to debug the project every time and click through the tabs, which is not very convenient. Or I can command out the tab xaml I want to to ignore. Anyone body out there has a solution?
You can also use the SelectedIndex property on the Ribbon to set which tab is the currently selected tab (0 being the first tab, 1 being the second, etc.)
<ribbon:Ribbon SelectedIndex="0" />
The only way I have found is to set the Selector.IsSelected property to true. This will cause the tab to become visible at design time.
<ribbon:RibbonTab Selector.IsSelected="True" ...
I can't confirm this is working right now because my preview in general is not working properly, but this works in general in WPF when trying to hide something at design time only.
Include the namespace for blend
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
Then in the element you want to hide use d:IsHidden="True". This will only affect design time, which eliminates the problem of forgetting to change the selected index to the correct value before building.
FindAncestor RelativeSource only supports 'Self' and 'TemplatedParent',
but I have to bind the width of a popup to the width of the page.
Giving the page a name causes problems because sometimes it will
throw exceptions saying a control with that name is already present in the visual tree.
<Popup IsOpen="True"
Width="{Binding ElementName=BordPage, Path=Width}"
Height="{Binding ElementName=BordPage, Path=Height}">
Background information:
I'm using a SL4 navigation based application here. BordPage is a navigation page,
which I'm using multiple times within the application. So giving it a name in the page itself is not really a good idea,
but I don't know how else I can bind to the width and height of the page.
What I'm trying to do is have a black border (with opacity 0.8) cover the entire screen,
(including the controls of the MainPage). Then on top of that I want to display some other controls.
Since the application is touch controlled, providing the user with a ComboBox to select a value doesn't really work wel. Instead I want to show this black overlay window with a listbox taking up most of the screen so the user can simply touch the value he wants with a single click.
Update: I just realized I can use the ChildWindow class to do this.
But my original question remains.
My general solution for this problem is by writing a custom behavior. It's not a pure XAML solution but it gives you a lot more flexibility.
Create a behavior that searches up the VisualTree to find the right item and then have it set the width of the Popup correctly.
It may be a little more complicated than a straight binding but it avoids all the naming issues.
Put the following in the constructor of your control so you can avoid naming it:
DataContext = this;