Develop Reference

WPF togglebutton having two states

Trying to add two states to a button, first click opens a canvas, the second closes the canvas.
<ToggleButton x:Name="retailButton" Content="Button" Canvas.Left="203" Canvas.Top="107" Width="327" Height="83" RenderTransformOrigin="0.49,0.398" Visibility="Visible" Opacity="0" Click="retailButton_Click" IsEnabled="True" >
not sure about the code behind?

You could use binding and a converter
<UserControl.Resources>
<BooleanToVisibilityConverter x:Key="BoolToVis" />
</UserControl.Resources>
...
<Canvas Visibility="{Binding ElementName=ToggleCanvasVisibility, Path=IsChecked, Converter={StaticResource BoolToVis}}}"/>
<ToggleButton x:Name="ToggleCanvasVisibility"/>
This is very close to this post: Binding a Button's visibility to a bool value in ViewModel

Open popup at the location of the button clicked

I am trying to create a popup that opens similar to the window preview option in Windows 8 taskbar. Basically, when I click or hover on a button, it opens a popup with basic information just above the button. Here is an example.
Right now, I am able to open the popup at either the extreme left or extreme right side of the page, using the code below.
<Frame x:Name="PopUpFrame" HorizontalAlignment="Left" Visibility="Hidden" Height="400" Margin="10,10,0,0" Grid.Row="1" VerticalAlignment="Bottom" Width="400" Source="/BasicApp;component/StandingOrderPopUp.xaml" NavigationUIVisibility="Hidden"/>
I have 3 different buttons in the button bar, so I cannot set the fixed margin. I am trying to set the same in code but I am unable to get the absolute position and convert it to margin property. I am not sure, if there is a better solution either.
Edit:
Tried using popup but it doesn't open on button click.
<Popup x:Name="PopUpFrame" Placement="Top" PlacementTarget="{Binding ElementName=StandingOrderButton}" Width="400" Height="400">
<DockPanel Background="#770081a7">
<Canvas DockPanel.Dock="Bottom" x:Name="PopupButtonBar" Height="50" VerticalAlignment="Bottom">
<Button Height="30" Width="125" HorizontalAlignment="Right" VerticalAlignment="Center" Canvas.Top="10" Content="CLOSE" Foreground="White" Background="#ff0081a7" BorderBrush="White" FontFamily="Trebuchet MS" Canvas.Left="10" />
</Canvas>
<Label Margin="5,0,0,0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" DockPanel.Dock="Top" Content="STANDING ORDERS" Foreground="#ffffffff"></Label>
<Grid DockPanel.Dock="Top">
<Border BorderThickness="2" BorderBrush="#FFff7a00"></Border>
<RichTextBox Margin="2" Foreground="#FF0081a7" FontFamily="Trebuchet MS" IsEnabled="False"/>
</Grid>
</DockPanel>
</Popup>
And here is the event handler.
Private Sub StandingOrder_Click(sender As Object, e As RoutedEventArgs)
PopUpFrame.Visibility = Windows.Visibility.Visible
End Sub
Edit:
Never mind. I am an idiot. Instead of setting IsOpen property, I set the visibility. :(
It works perfectly, although, I had to copy the whole design from the separate page to this one. Still better than nothing. Only problem now is if I click on something else, I will have to write code to make sure popup is closed.

You can use a Popup control, coupled with it's Placement property to display your popup based on the current location of your buttons.
<Popup Placement="Top" PlacementTarget="{Binding ElementName=yourButton}" ... />
Inside your Popup, you can place your UserControl or any content element which will act as the popup's content.
See here for further information on popup placements, and here for a tutorial on WPF Popup controls.

Think about using ContextMenu, and set it's content you whatever you want. Thats is the solution for you.

This is how i defined one of my popups:
<Popup x:Name="btnPowerPopup" Placement="Mouse" StaysOpen="False">
....
</Popup>
you can user from the code behind on a button click or something :
btnPowerPopup.IsOpen = true;
and when the job is done:
btnPowerPopup.IsOpen = false;
But StaysOpen="False" let's you close the PopUp when clicking somewhere else.

Tabitem header is not showing its label using Prism and WPF

I am working on WPF and prism5 and also using RadTabControl,I am able to create tabs dynamically, now issue is i am not able to set tab header, i am using eventAggregator, value is coming fine till shellViewModel but its not able to set Tab header
My tab control is in shellview.xaml its code is
<telerik:RadTabControl prism:RegionManager.RegionName="ContentRegion"
Margin="1" x:Name="tabControl"
VerticalContentAlignment="Stretch"
HorizontalContentAlignment="Stretch"
ItemTemplate="{StaticResource TabItemTemplate}"/>
and here is my code for tab item
<DataTemplate x:Key="TabItemTemplate">
<StackPanel Orientation="Horizontal" VerticalAlignment="Center">
<TextBlock Text="{Binding TabHeader}"/>
<telerik:RadButton Command="{Binding RemoveItemCommand}"
Style="{StaticResource CloseButton}"
Margin="10,0,0,0"
ToolTipService.ToolTip="Remove item" />
</StackPanel>
</DataTemplate>
tab is creating fine with its view but its not able to set tab header value, Please let me know what is the issue.
Thanks

Issue was i was not setting TabHeader property in its own ViewModel which was causing not to display header name.
Thanks

Make WPF App Accessible to screen reader

I have a WPF application and part of the requirements are that it is accessible, including keyboard navigation and screen readers.
I have had some success with a a Treeview in the application by setting the AutomationProperties.Name in the ItemContainerStyle of the Treeview, but I am having problems with a Window that contains a text area and some buttons.
ZoomText will correctly read out the Title of the Window, but do so twice, as well as the text in the buttons, but I cannot get it to read the contents of the TextBlock.
The Text block is defined in a window as below. There are no binding errors showing up in the Visual Studio output while debugging, and the NVDA screen reader can read the content correctly, although this is not good enough for me as the customer uses ZoomText.
<Window x:Class="UserControls.ModalDialog"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
mc:Ignorable="d"
d:DesignHeight="160" d:DesignWidth="400" MinHeight="85" MinWidth="400" MaxWidth="400" SizeToContent="Height" Height="Auto"
WindowStartupLocation="CenterScreen" ResizeMode="NoResize" Title="{Binding TitleText }">
<DockPanel Width="Auto" Margin="20,20,0,10">
<StackPanel Orientation="Vertical">
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding Path=DialogText, Mode=TwoWay}" Cursor="Arrow" Focusable="True" TextWrapping="WrapWithOverflow"
Height="Auto" Width="325" TextOptions.TextFormattingMode="Display"
ToolTip="{Binding Path=Text, RelativeSource={RelativeSource Self}}"
AutomationProperties.Name="{Binding Path=Text, RelativeSource={RelativeSource Self}}"
AutomationProperties.AutomationId="{Binding Path=Text, RelativeSource={RelativeSource Self}}">
</TextBlock>
</StackPanel>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Right" Margin="0,10,5,0">
<Button Content="{Binding Path=Option1ButtonText, Mode=TwoWay}" Padding="5,0,5,0" Margin="0,20,5,0" MinWidth="100" IsDefault="True" Command="{Binding Path=Option1ButtonCommand, Mode=TwoWay}" />
<Button Content="{Binding Path=Option2ButtonText, Mode=TwoWay}" Padding="5,0,5,0" Margin="2,20,10,0" MinWidth="75" Command="{Binding Path=Option2ButtonCommand, Mode=TwoWay}" Visibility="{Binding Option2ButtonVisibility, Mode=TwoWay}"/>
<Button Content="{Binding Path=CancelButtonText, Mode=TwoWay}" Padding="5,0,5,0" Margin="2,20,10,0" MinWidth="75" IsCancel="True" Visibility="{Binding CancelButtonVisibility, Mode=TwoWay}"/>
</StackPanel>
</StackPanel>
</DockPanel>
If anyone has had any success with WPF and Screen readers and has any insight, or can point me in the right direction it would be great.
Update:
It seems the problem is because the TextBlock is within another element. If the window has the TextBlock as it's only element the screen reader reads the text correctly. However I need the Dock and Stack Panels for layout, so I need to find a way to get the Screen reader to work when the TextBlock is not the only content in the window.

You can do pretty much everything you need using the Automation Properties
For example;
Name
HelpText
Labels / LabeledBy
See documentation for more details on usage. Kind of surprised this wasn't answered by now considering the amount of upvotes. Either way, hope this helps. Cheers!

How do I make a WPF popup draggable using a thumb?

I've searched long and hard to find an example of this on the net. I've seen the alternative methods for this but I want to specifically use a thumb. In trying to hash out a solution I've been unable to get the functionality right/working as I'm fairly new to WPF. I'd be grateful if someone could give an example of how you may implement the above.
Cheers

A Popup doesn't give you an obvious way to move it; you can only place it relative to its placement target. However it does give you and additional offset relative to the placement target and that's enough to move it anywhere.
Here's a working markup-only solution that demonstrates a draggable Popup using a Thumb using Markup Programming. There is a text box that has a popup that pops up when the text box receives the keyboard focus. The popup has some text and a thumb.
<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:p="http://markupprogramming.codeplex.com/markup/programming"
Height="300" Width="300">
<Grid>
<StackPanel>
<TextBox x:Name="textBox1" Width="200" Height="20"/>
</StackPanel>
<Popup Name="popup" PlacementTarget="{Binding ElementName=textBox1}"
IsOpen="{Binding IsKeyboardFocused, ElementName=textBox1, Mode=OneWay}">
<StackPanel Orientation="Horizontal">
<TextBlock Background="White" Text="Sample Popup content."/>
<Thumb Name="thumb" Width="20" Height="20"/>
</StackPanel>
<p:Attached.Operations>
<p:ScriptHandler Path="#FindElement('thumb').DragDelta">
#AssociatedObject.HorizontalOffset += #EventArgs.HorizontalChange;
#AssociatedObject.VerticalOffset += #EventArgs.VerticalChange;
</p:ScriptHandler>
</p:Attached.Operations>
</Popup>
</Grid>
</Window>