WPF RibbonGroup selection Changed Event - wpf

Hi i'm wondering if someone can help me.
I'm using a WPF Ribbon control and specifically a RibbonGroup control within that. The xaml for the RibbonGroup that i am using is below.
<r:RibbonGroup x:Name="ribbonGroup" Header="Ribbon Group" >
<r:RibbonRadioButton Label="Item 1" IsChecked="True" />
<r:RibbonRadioButton Label="Item 2" />
<r:RibbonRadioButton Label="Item 3" />
</r:RibbonGroup>
Now the issue i am having is how can i identify when a selectio is changed in this group. So if i selected Item 2 or Item 3 how can i be notifified which actual item is selected. Is there some sort of changed event on the RibbonGroup control that i can bind to ? I have looked on the web but not really had any luck i would mega appreciate it if anyone can point me in the correct direction.
Thanks
Iffy.

You want to bind to the Checked event of the radio buttons. The Checked event is a routed event, so you can bind it in the RibbonGroup element itself:
<r:RibbonGroup x:Name="ribbonGroup" Header="Ribbon Group"
RadioButton.Checked="YourEventHandler">
<r:RibbonRadioButton Label="Item 1" IsChecked="True" />
<r:RibbonRadioButton Label="Item 2" />
<r:RibbonRadioButton Label="Item 3" />
</r:RibbonGroup>
In the event handler the RoutedEventArgs.Source property is a reference to the radio button that was checked.

Related

Set RibbonButton Style as it would be clicked

I have a few default RibbonButtons:
<RibbonButton x:Name="MouseModeButton" Label="Maus" Click="MouseModeButton_Click"
LargeImageSource="/Images/MainWindow/Mouse.png" />
<RibbonButton x:Name="MarkModeButton" Label="Markieren" Click="MarkModeButton_Click"
LargeImageSource="/Images/MainWindow/Mark.png" />
These buttons are "modes" where only one (the last clicked) is enabled.
I want this enabled RibbonButton to be highlighted from the other ones - the best thing I could come up with is to set the style as it would be clicked right now.
I tried to google it, but the world of WPF seemd to be abadoned from good googleable solutions in xaml. So how would I set this programmaticly from code behind, when a button is clicked, the style should be like the moment when it is clicked?
You could use the built-in RibbonRadioButton instead, it does exactly what you want.
<RibbonRadioButton x:Name="MouseModeButton" Label="Maus" Click="MouseModeButton_Click"
LargeImageSource="/Images/MainWindow/Mouse.png" />
<RibbonRadioButton x:Name="MarkModeButton" Label="Markieren" Click="MarkModeButton_Click"
LargeImageSource="/Images/MainWindow/Mark.png" />
You can define mutually exclusive button groups using the GroupName property, e.g.:
<Ribbon>
<RibbonTab Header="tab">
<RibbonGroup Header="Sample">
<RibbonRadioButton Label="Group 1 - Button 1" GroupName="Group 1"/>
<RibbonRadioButton Label="Group 1 - Button 2" GroupName="Group 1"/>
<RibbonRadioButton Label="Group 1 - Button 3" GroupName="Group 1"/>
<RibbonRadioButton Label="Group 2 - Button 1" GroupName="Group 2"/>
<RibbonRadioButton Label="Group 2 - Button 2" GroupName="Group 2"/>
<RibbonRadioButton Label="Group 2 - Button 3" GroupName="Group 2"/>
</RibbonGroup>
</RibbonTab>
</Ribbon>

How does the Content property work

Both syntaxes below works. My question is how does WPF know Content is what I specified?
<Button>
<Button.Content>
my button
</Button.Content>
</Button>
<Button>
my button <!--how does wpf know this is the content-->
</Button>
similarly, how does wpf know I'm now adding ListBoxItems
<ListBox>
<!--ListBox.Items-->
<ListBoxItem Content="item 1" /> <!--XAML automatically knows I'm specifying items-->
item 2
<ListBoxItem Content="item 3" />
<!--/ListBox.Items-->
</ListBox>
So in ContentControl, the default property is Content, and with ItemsControl, the default is Items, and with TextBox, the default is TextBox.
How does this 'default' work?
How do I create this 'default property' when I creat a Custom Control?
ContentPropertyAttribute tells xaml parser which property to use for direct content.
ContentControl, from which Button inherits, is marked with attibute [ContentProperty("Content")]. Similarly, ItemsControl (ancestor of ListBox) is marked with [ContentProperty("Items")].

Xceed splitbutton with menu items and sub menuitems

I`m trying to have a dropdown menu under a split button. Some of these menuItems should have sub-menu items. If you want an example, click on the bookmark button in Firefox (top right).
I can't use Menu, because that is always oriented horizontally. So I went with a stackpanel:
<Window x:Class="WpfApplication3.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:xctk="http://schemas.xceed.com/wpf/xaml/toolkit"
Title="MainWindow" Height="350" Width="525">
<Grid>
<xctk:SplitButton Content="SplitButton" BorderThickness="1" BorderBrush="Black" Margin="0,0,408,290">
<xctk:SplitButton.DropDownContent>
<StackPanel Width="161" HorizontalAlignment="Left">
<MenuItem Header="MenuItem1" HorizontalAlignment="Left" Width="517">
<MenuItem.Items>
<MenuItem Header="submenuItem1"/>
<MenuItem Header="submenuItem2"/>
</MenuItem.Items>
</MenuItem>
<MenuItem Header="MenuItem2"/>
<MenuItem Header="MenuItem3"/>
</StackPanel>
</xctk:SplitButton.DropDownContent>
</xctk:SplitButton>
</Grid>
Problem here is that the sub menu items don't show up. They don't even have the little arrows next to them. You can do this without the SplitButton, just leaving the stackpanel and everything in it, you'll have the same problem. I've tried putting the parent Menu item in its own tag, but I want the sub-menu items to appear to the right of their parent (just like the firefox example: Assuming your firefox window is not maximized, and you've allowed enough screen-space for the item to appear).
the way you're using the MenuItem control is wrong, it is meant to be hosted inside the Menu control or another MenuItem.
As for the solution to your problem, there are two. the first one is to write a custom control that reuses the ContextMenu to host the menu items, you will write something like this:
<m:SplitButton Content="Split Button" Placement="Bottom">
<MenuItem Header="MenuItem 1"/>
<MenuItem Header="MenuItem 2">
<MenuItem Header="MenuItem 1"/>
<MenuItem Header="MenuItem 2"/>
</MenuItem>
</m:SplitButton
http://www.codeproject.com/Articles/20612/A-WPF-SplitButton
the second approach is to host the Menu control inside the DropDownContent and re-style everything, there will be a lot of xaml markup.
the Menu control will be easy to re-style, the only thing you need to do is make sure that menu items are displayed vertically instead of horizontally, using the following markup:
<Style TargetType="Menu">
<Setter Property="ItemsPanel">
<Setter.Value>
<ItemsPanelTemplate>
<StackPanel Orientation="Vertical" IsItemsHost="True" />
</ItemsPanelTemplate>
</Setter.Value>
</Setter>
</Style>
the hardest part is styling the MenuItems, they are styled based on their Role property. It can have four possible values:
TopLevelHeader : direct child of Menu with sub-menu items.
TopLevelItem : direct child of Menu without sub-menu items.
SubmenuHeader : direct child of MenuItem with sub-menu items.
SubmenuItem : direct child of MenuItem without sub-menu items.
Regards

WPF Equivalent to Flex VGroup

What is WPF equivalent to Flex VGroup?
My Intent is to have a vertical list of checkboxes
Flex declaration would look like this
<s:VGroup>
<s:CheckBox label="Item 1" />
<s:CheckBox label="Item 2" />
<s:CheckBox label="Item 3" />
</s:VGroup>
I have fooled around with Grid without much success.
That should do the job.
<StackPanel Orientation="Vertical">
...
</StackPanel>
http://msdn.microsoft.com/en-us/library/system.windows.controls.stackpanel.aspx

How do I make a radiobutton look like a toggle button?

Windows Phone 7: How do I make a radiobutton look like a toggle button?
I am trying to get the selected radio button to look like a depressed button.
Basically I have a filter by 'FName', 'LName' radio button over my list of names. RadioButton takes up too much screen space. A depressed button will save the space used by the 'O'
You can try changing your Xaml to specify a ToggleButton which is the base class for RadioButtons and CheckBox's, but since it is a ToggleButton you will have to interlock them in the Checked and UnChecked events. See this article and this MSDN information. Your only other option would be to create a new Style for your RadioButtons.
From:
<RadioButton Content="First Name" Height="72" HorizontalAlignment="Left" Margin="38,92,0,0" Name="FName" VerticalAlignment="Top" Width="102" />
To:
<ToggleButton Content="First Name" Height="72" HorizontalAlignment="Left" Margin="38,92,0,0" Name="FName" VerticalAlignment="Top" Width="102" />
You can only do this if you overwrite the template radio button.
In WPF, we can use the following "hack":
<RadioButton Style="{StaticResource {x:Type ToggleButton}}" />
I believe that this does not work for WP7.
I suggest you create your own style of 0.
You can use the Expression Blend to facilitate your work. Look about writing styles that should help.

Resources