I'm currently trying to apply styling to my menuItem. I had to center it's header inside the control, and the only way to it that I had found is this:
<MenuItem>
<MenuItem.Header>
<TextBlock Text="About" VerticalAlignment="Center" HorizontalAlignment="Center"/>
</MenuItem.Header>
</MenuItem>
Now, I am trying to apply styles, but I can't seem to manage to bind the textboxes' text from style to the actual xaml value.
My style:
<Style x:Key="MenuItemBaseStyle" TargetType="MenuItem">
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Background" Value="#0a99f3" />
<Setter Property="Foreground" Value="White"/>
</Trigger>
</Style.Triggers>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type MenuItem}">
<Grid Background="{TemplateBinding Background}">
<MenuItem>
<MenuItem.Header>
<TextBlock Text="{TemplateBinding Text}" />
</MenuItem.Header>
</MenuItem>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
TemplateBinding is just one of the approaches I tried, though none worked even remotely close.
EDIT - FULL XAML ON REQUEST:
<Window x:Class="DownloadManager.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:DownloadManager"
xmlns:controls="clr-namespace:DesignInControl"
mc:Ignorable="d"
Title="MainWindow" Height="700" Width="1000" Background="#22282a" ResizeMode="NoResize">
<Border BorderThickness="1" BorderBrush="#ffcd22" Margin="10,10,10,10">
<Grid>
<controls:CircularProgressBar VerticalAlignment="Bottom" HorizontalAlignment="Right" Margin="0,0,10,10" SegmentColor="#ffcd22" StrokeThickness="5" Percentage="100" Radius="80" Grid.ZIndex="0"/>
<Border VerticalAlignment="Bottom" HorizontalAlignment="Right" Margin="0,0,10,10" Width="170" Height="170">
<TextBlock FontSize="60" Text="10%" FontFamily="simplifica" Foreground="White" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Border>
<Image x:Name="noshare_png" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="-8,10" Source="noshare.png" Width="100" Height="100"/>
<Border Width="210" Height="100" Margin="97,10,665,540">
<TextBlock Text="NoShare" FontSize="85" FontFamily="simplifica" Foreground="#ffcd22" VerticalAlignment="Center" HorizontalAlignment="Center"/>
</Border>
<Menu x:Name="menu" HorizontalAlignment="Left" Height="100" Margin="352,10,0,0" VerticalAlignment="Top" Width="600" FontFamily="simplifica" FontSize="30">
<MenuItem Height="100" Width="200" Style="{StaticResource MenuItemBaseStyle}">
<MenuItem.Header>
<TextBlock Text="File"/>
</MenuItem.Header>
</MenuItem>
<MenuItem Height="100" Width="200" Style="{StaticResource MenuItemBaseStyle}">
<MenuItem.Header>
<TextBlock Text="Settings"/>
</MenuItem.Header>
</MenuItem>
<MenuItem Height="100" Width="200" Style="{StaticResource MenuItemBaseStyle}">
<MenuItem.Header>
<TextBlock Text="About"/>
</MenuItem.Header>
</MenuItem>
</Menu>
</Grid>
</Border>
</Window>
Use MenuItem.HeaderTemplate.
<Style x:Key="MenuItemBaseStyle" TargetType="MenuItem">
<Setter Property="HeaderTemplate">
<Setter.Value>
<DataTemplate>
<TextBlock Text="{Binding}" VerticalAlignment="Center" HorizontalAlignment="Center"/>
</DataTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Background" Value="#0a99f3" />
<Setter Property="Foreground" Value="White"/>
</Trigger>
</Style.Triggers>
</Style>
Updated: Combined your style with the original solution.
Related
how do make a letter pop out of the border?
I want to express it like this picture
I wrote a letter in the text on Border,
The letters are covered like in the picture.
Can you make this stick out like the picture below?
How can solve this?
this is my xaml code
<Window x:Class="TestProject.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:TestProject"
Width="800"
Height="600"
Title="ItemsControl 엘리먼트 : Template/ItemsPanel/ItemTemplate/ItemContainerStyle 속성 사용하기"
FontFamily="나눔고딕코딩"
FontSize="16">
<Window.Resources>
<local:TaskCollection x:Key="TaskCollectionKey" />
</Window.Resources>
<Grid>
<ItemsControl
HorizontalAlignment="Center"
VerticalAlignment="Center"
ItemsSource="{Binding Source={StaticResource TaskCollectionKey}}">
<ItemsControl.Template>
<ControlTemplate TargetType="ItemsControl">
<Border
BorderBrush="Black"
BorderThickness="3"
CornerRadius="15">
<ItemsPresenter />
</Border>
</ControlTemplate>
</ItemsControl.Template>
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<DataTemplate.Resources>
<Style TargetType="TextBlock">
<Setter Property="HorizontalAlignment" Value="Center" />
</Style>
</DataTemplate.Resources>
<Grid>
<Ellipse
Stroke="Black"
StrokeThickness="3"
Fill="Gold" />
<StackPanel
HorizontalAlignment="Center"
VerticalAlignment="Center">
<TextBlock
Margin="5"
Text="{Binding Path=Priority}" />
<TextBlock
Margin="5"
Text="{Binding Path=TaskName}" />
</StackPanel>
</Grid>
</DataTemplate>
</ItemsControl.ItemTemplate>
<ItemsControl.ItemContainerStyle>
<Style>
<Setter Property="Control.Margin" Value="10" />
<Setter Property="Control.Width" Value="100" />
<Setter Property="Control.Height" Value="100" />
<Style.Triggers>
<Trigger
Property="Control.IsMouseOver" Value="True">
<Setter Property="Control.ToolTip"
Value="{Binding RelativeSource={x:Static RelativeSource.Self},
Path=Content.Description}" />
</Trigger>
</Style.Triggers>
</Style>
</ItemsControl.ItemContainerStyle>
</ItemsControl>
</Grid>
</Window>
If you put the textblock in a canvas, that will not clip.
<StackPanel
HorizontalAlignment="Center"
VerticalAlignment="Center">
<TextBlock
Margin="5"
Text="{Binding Path=Priority}" />
<Canvas>
<TextBlock
Text="{Binding Path=TaskName}" />
</Canvas>
</StackPanel>
I'm trying to add rounded windows so that view looks from this:
To this:
There are a few similar questions online that say change the WindowStyle to None and AllowsTransparency=True with a Border tag as seen below.
<Window x:Class="SIDD.EmailComposerWindow"
...
Height="460.316"
Width="733.167"
WindowStartupLocation="CenterScreen"
WindowStyle="None"
AllowsTransparency="True"
ResizeMode="CanResize"
<Border Background="White" BorderBrush="Black" BorderThickness="1,1,1,1" CornerRadius="30,30,30,30">
<Grid>
</Grid>
</Border>
>
<Window.Background>
<SolidColorBrush Opacity="0" />
</Window.Background>
<WindowChrome.WindowChrome>
<WindowChrome CaptionHeight="{Binding ActualHeight,ElementName=TitleBar}"
GlassFrameThickness="0"
/>
</WindowChrome.WindowChrome>
<Window.DataContext>
<localvm:EmailComposerViewModel />
</Window.DataContext>
<Window.Style>
<Style TargetType="{x:Type Window}">
<Setter Property="Background" Value="{StaticResource WindowBrush}"/>
</Style>
</Window.Style>
<Window.Resources>
<SolidColorBrush x:Key="WindowBrush" Color="White"/>
<Style x:Key="VerticalSeparatorStyle"
TargetType="{x:Type Separator}"
BasedOn="{StaticResource {x:Type Separator}}">
<Setter Property="Margin" Value="6,0,6,0"/>
<Setter Property="LayoutTransform">
<Setter.Value>
<TransformGroup>
<TransformGroup.Children>
<TransformCollection>
<RotateTransform Angle="90"/>
</TransformCollection>
</TransformGroup.Children>
</TransformGroup>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="ButtonLinkStyle" TargetType="Button">
<Setter Property="Background" Value="Transparent" />
<Setter Property="Margin" Value="2,4,2,4" />
<Setter Property="IsTabStop" Value="False" />
<Setter Property="Cursor" Value="Hand" />
<Setter Property="BorderThickness" Value="0" />
<Setter Property="OverridesDefaultStyle" Value="True" />
<Setter Property="Foreground" Value="Blue" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Border Name="border" BorderThickness="0" BorderBrush="Transparent">
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="BorderBrush" TargetName="border" Value="White"/>
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter Property="Foreground" Value="DarkGoldenrod"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<BooleanToVisibilityConverter x:Key="BoolToVis"/>
<Style x:Key="SearchButton" TargetType="{x:Type Button}">
<Setter Property="Background" Value="Transparent" />
<Setter Property="Margin" Value="2,4,2,4" />
<Setter Property="IsTabStop" Value="False" />
<Setter Property="Cursor" Value="Hand" />
<Setter Property="BorderThickness" Value="0" />
<Setter Property="OverridesDefaultStyle" Value="True" />
<Setter Property="Foreground" Value="Blue" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Border x:Name="border" BorderThickness="0" BorderBrush="Transparent">
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="BorderBrush" TargetName="border" Value="White"/>
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter Property="Foreground" Value="DarkGoldenrod"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Image x:Key="SearchIcon" Source="../Images/Search.png" Height="15px" Width=" 15px"/>
<Image x:Key="ResetIcon" Source="../Images/CancelX.png" Height="15px" Width="15px"/>
<Style x:Key="PaneBorderStyle" TargetType="{x:Type Border}">
<Setter Property="CornerRadius" Value="10,10,10,10"/>
<Setter Property="BorderThickness" Value="0"/>
<Setter Property="Margin" Value="0,0,0,0"/>
<Setter Property="Background" Value="WhiteSmoke"/>
</Style>
</Window.Resources>
<!-- Content Layout -->
<DockPanel Margin="10,10,10,10">
<!-- Header -->
<Border Background="Blue" Style="{DynamicResource PaneBorderStyle}" CornerRadius="15,15,0,0">
<Grid>
<TextBlock HorizontalAlignment="Stretch" Margin="0,0,0,0" Name="textBlock_From" Width="283" />
</Grid>
</Border>
<!-- Body -->
<Grid DockPanel.Dock="Top">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="77*"/>
<ColumnDefinition Width="64*"/>
<ColumnDefinition Width="141*"/>
<ColumnDefinition Width="140*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition />
</Grid.RowDefinitions>
<!-- Left panel -->
<Border Style="{DynamicResource PaneBorderStyle}" Margin="0,0,0,0" Grid.ColumnSpan="2" >
<DockPanel VerticalAlignment="Top">
<StackPanel Orientation="Horizontal" DockPanel.Dock="Top">
<Label VerticalAlignment="Center" Content="Email from:" Opacity="0.6" FontFamily="Levenim MT" Width="100" />
<TextBox BorderThickness="0" IsReadOnly="True" Background="Transparent" VerticalAlignment="Center" Text="{Binding Ticket.CustomerName}" />
</StackPanel>
<StackPanel Orientation="Horizontal" DockPanel.Dock="Top">
<Label Content="Case:" OpacityMask="Black" Opacity="0.6" FontFamily="Levenim MT" Width="100" />
<TextBox BorderThickness="0" IsReadOnly="True" Background="Transparent" VerticalAlignment="Center" Text="{Binding Ticket.CaseDetails}" />
</StackPanel>
<StackPanel Orientation="Horizontal" VerticalAlignment="Top" DockPanel.Dock="Top">
<Label Content="Account Details:" Opacity="0.6" FontFamily="Levenim MT" Width="100" />
<TextBox BorderThickness="0" IsReadOnly="True" Background="Transparent" VerticalAlignment="Center" Text="{Binding Ticket.AccountInfo}" />
</StackPanel>
<StackPanel Orientation="Horizontal" DockPanel.Dock="Top">
<Label Content="Date:" Opacity="0.6" FontFamily="Levenim MT" Width="100" />
<TextBox BorderThickness="0" IsReadOnly="True" Background="Transparent" VerticalAlignment="Center" Text="{Binding Ticket.MessageDate}" />
</StackPanel>
<Rectangle Fill="#FFF4F4F5" Stroke="Black" DockPanel.Dock="Top" Opacity="0.2" Margin="0,5,0,5"/>
<TextBox BorderThickness="0" IsReadOnly="True" Background="Transparent" Text="{Binding Ticket.MessageContent}" TextWrapping="Wrap" DockPanel.Dock="Top" />
</DockPanel>
</Border>
<!-- Center panel -->
<Border Style="{DynamicResource PaneBorderStyle}" CornerRadius="10,0,0,10" Grid.Column="2" Background="White" Width="Auto">
<DockPanel LastChildFill="True">
<StackPanel Orientation="Horizontal" DockPanel.Dock="Top">
<Label VerticalAlignment="Center" Content="To" Opacity="0.6" FontFamily="Levenim MT" Margin="5,0,0,0" />
<TextBox BorderThickness="0" IsReadOnly="True" Background="#E8F2FF" Text="{Binding Ticket.CustomerEmailAddress}" FontSize="12" VerticalAlignment="Center" />
</StackPanel>
<Rectangle Fill="#FFF4F4F5" Stroke="Black" DockPanel.Dock="Top" Opacity="0.2"/>
<StackPanel Orientation="Horizontal" DockPanel.Dock="Top">
<Label Content="Subject" Opacity="0.6" FontFamily="Levenim MT" Margin="5,0,0,0"/>
<TextBox BorderThickness="0" IsReadOnly="True" Background="Transparent" VerticalAlignment="Center" Text="{Binding Ticket.Subject}" />
</StackPanel>
<Rectangle Fill="#FFF4F4F5" Stroke="Black" DockPanel.Dock="Top" Opacity="0.2"/>
<ToolBar Margin="2" Background="LightGray" DockPanel.Dock="Top" Visibility="Collapsed">
<Button>1</Button>
<Button>2</Button>
<Button>3</Button>
<Button>4</Button>
<ComboBox SelectedIndex="0">
<ComboBoxItem>Style1</ComboBoxItem>
<ComboBoxItem>Style2</ComboBoxItem>
<ComboBoxItem>Style3</ComboBoxItem>
</ComboBox>
<Button>5</Button>
<Button>6</Button>
<Separator />
<Button>7</Button>
<Button>8</Button>
<Separator />
<Button>9</Button>
<Button>10</Button>
</ToolBar>
<RichTextBox Name="EditMessageBox" Margin="5,0,5,5" DockPanel.Dock="Top" Height="auto" BorderThickness="5" BorderBrush="{x:Null}" Background="White">
<RichTextBox.Resources>
<Style TargetType="{x:Type Paragraph}">
<Setter Property="Margin" Value="0" />
</Style>
</RichTextBox.Resources>
</RichTextBox>
</DockPanel>
</Border>
<!-- Right panel -->
<Border Style="{DynamicResource PaneBorderStyle}" CornerRadius="0,10,10,0" Grid.Column="3">
<Grid Margin="2">
<DockPanel LastChildFill="True" RenderTransformOrigin="0.5,0.5">
<!-- suggestions -->
<Label Content="SUGGESTIONS" HorizontalAlignment="Left" DockPanel.Dock="Top" FontFamily="Levenim MT" Margin="0" Width="90.277" Opacity="0.6" />
<!-- snippet list -->
<Grid Height="Auto" x:Name="SnippetViewGrid">
<StackPanel x:Name="AccordianStack" Margin="0,0,0,10">
<!--Snippet Categories-->
<ItemsControl ItemsSource="{Binding ObservableSnippetCategories}">
<ItemsControl.ItemTemplate>
<DataTemplate>
<custom:Accordian x:Name="Accordian" ButtonClick="Accordian_ButtonClick"
TemplateSelectCommand="{Binding TemplateSelectCommand, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type local:EmailComposerWindow}}}"
TemplateShowCommand="{Binding TemplateShowCommand, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type local:EmailComposerWindow}}}">
</custom:Accordian>
</DataTemplate>
</ItemsControl.ItemTemplate>
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Vertical"/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
</ItemsControl>
</StackPanel>
</Grid>
</DockPanel>
<!-- Searchbar -->
<DockPanel Margin="5,5,5,5" LastChildFill="True" Height="35.667" VerticalAlignment="Bottom">
<Border Margin="0,4,0,0" Width="Auto" CornerRadius="5,5,5,5" Background="White" BorderThickness="1" BorderBrush="Gray">
<Grid>
<Button x:Name="SearchTemplateButton" Content="{StaticResource SearchIcon}"
Command="{Binding SearchTemplatesCommand, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type local:EmailComposerWindow}}}"
CommandParameter="{Binding Text, ElementName=SearchKey}"
Style="{StaticResource ButtonLinkStyle}" Opacity="0.5" HorizontalAlignment="Left" VerticalAlignment="Center"
/>
<TextBox x:Name="SearchKey" Text="" BorderThickness="0" Width="Auto" Background="White" Margin="21.724,4,20.999,4">
<TextBox.InputBindings>
<KeyBinding Key="Enter"
Command="{Binding SearchTemplatesCommand, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type local:EmailComposerWindow}}}"
CommandParameter="{Binding Text, ElementName=SearchKey}"
/>
<KeyBinding Key="Esc"
Command="{Binding ResetSearchCommand, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type local:EmailComposerWindow}}}"
/>
</TextBox.InputBindings>
</TextBox>
<Button x:Name="ResetSearchButton" Content="{StaticResource ResetIcon}"
Command="{Binding ResetSearchCommand, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type local:EmailComposerWindow}}}"
Style="{DynamicResource SearchButton}" Opacity="0.5" Width="18.999" Height="Auto"
Margin="0,4,2,4" HorizontalAlignment="Right" VerticalAlignment="Center"
/>
</Grid>
</Border>
</DockPanel>
</Grid>
</Border>
</Grid>
</DockPanel>
However, with this added code, I get the error The property content is set more than once for the following code:
<!-- Header -->
<Border Background="Transparent" DockPanel.Dock="Top" x:Name="TitleBar">
<DockPanel LastChildFill="True" Margin="0,0" HorizontalAlignment="Center" DockPanel.Dock="Top" Height="20">
</DockPanel>
</Border>
Does anyone know why this is?
You have set twice the window style here:
<Window.Style>
<Style TargetType="{x:Type Window}">
<Setter Property="Background" Value="{StaticResource WindowBrush}"/>
</Style>
And here:
WindowStyle="None"
I'm not close to a VS right now but it seems to be the problem.
I'm using C# WPF Application
I need your help.
If I press on a button it should be selected, but if I now press on another button it should be selected and the other button should not be selected.
It should show where the user is.The button should be selected until another button has been clicked.
But when you go with the mouse over, the normal mouse over effect should come.
<Window x:Name="windowsForm" x:Class="Vorschau.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:Vorschau"
mc:Ignorable="d"
Title="Vorschaukomponente" Height="514.583" Width="805.208" FontFamily="Century Gothic" WindowStartupLocation="Manual" BorderThickness="0" ResizeMode="NoResize" WindowStyle="None" Icon="C:\Users\user\Documents\Visual Studio 2015\Projects\Vorschau\Vorschau\img\coordinates.ico" Background="{x:Null}" AllowsTransparency="True">
<Window.Resources>
<Style x:Key="border_res" TargetType="{x:Type Border}">
<Setter Property="Background" Value="#3A3A3B" />
<Setter Property="CornerRadius" Value="10" />
</Style>
</Window.Resources>
<Border Style="{StaticResource border_res}">
<Grid>
<Canvas HorizontalAlignment="Left" Height="60" VerticalAlignment="Top" Width="185" Background="#FFE57E31">
<Canvas Height="64" Canvas.Top="451" Width="185" Background="#FF2C373F">
<Label x:Name="lbCopyright" Content="© Name 2017" Canvas.Left="10" Canvas.Top="29" Width="121" Foreground="#FF1B1D1F"/>
</Canvas>
<Canvas Height="391" Canvas.Top="60" Width="185" Background="#FF37424A">
<Button x:Name="btVorschau" Content="Vorschau" HorizontalAlignment="Left" VerticalAlignment="Bottom" Width="185" Height="50" Foreground="LightGray" FontSize="16"
HorizontalContentAlignment="Left" BorderBrush="{x:Null}" Click="Button_Click">
<Button.Style>
<Style TargetType="{x:Type Button}">
<Setter Property="Background" Value="#FF37424A"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Border Background="{TemplateBinding Background}">
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="#FF303B43"/>
<Setter Property="Foreground" Value="Red"/>
</Trigger>
</Style.Triggers>
</Style>
</Button.Style>
</Button>
<Button x:Name="btEinstellung" Content="Einstellung" HorizontalAlignment="Left" VerticalAlignment="Bottom" Width="185" Height="50" Foreground="LightGray" FontSize="16"
HorizontalContentAlignment="Left" BorderBrush="{x:Null}" Canvas.Top="50" Click="btEinstellung_Click">
<Button.Style>
<Style TargetType="{x:Type Button}">
<Setter Property="Background" Value="#FF37424A"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Border Background="{TemplateBinding Background}">
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="#FF303B43"/>
<Setter Property="Foreground" Value="Red"/>
</Trigger>
</Style.Triggers>
</Style>
</Button.Style>
</Button>
</Canvas>
<Canvas Height="60" Canvas.Left="185" Width="618" Background="#FFEEE9ED">
<Label x:Name="lbClose" Content="X" Canvas.Left="578" FontSize="20" MouseDoubleClick="lbClose_MouseDoubleClick"/>
<Label x:Name="lbMinimize" Content="-" Canvas.Left="556" FontSize="22" Canvas.Top="-2" MouseDoubleClick="lbMinimize_MouseDoubleClick"/>
<Label x:Name="lbWhereIAm" Content="Label" Canvas.Left="10" Canvas.Top="15" Width="162" FontSize="20"/>
</Canvas>
<Canvas x:Name="canvasContent" Height="455" Canvas.Left="185" Canvas.Top="60" Width="618" Background="#FFD1CFD0">
<TabControl x:Name="tabControl" Height="241" Canvas.Left="93" Canvas.Top="87" Width="440" SelectedIndex="0" ScrollViewer.VerticalScrollBarVisibility="Disabled">
<TabItem x:Name="tabitem1" Header="TabItem">
<Grid Background="#FFE5E5E5">
<Label x:Name="label1" Content="Label" HorizontalAlignment="Left" Margin="99,95,0,0" VerticalAlignment="Top" Background="#FF2387FF"/>
</Grid>
</TabItem>
<TabItem x:Name="tabitem2" Header="TabItem" ScrollViewer.VerticalScrollBarVisibility="Disabled">
<Grid Background="#FFE5E5E5">
<Label x:Name="label" Content="Label" HorizontalAlignment="Left" Margin="138,124,0,0" VerticalAlignment="Top" Background="#FFF70000"/>
</Grid>
</TabItem>
</TabControl>
</Canvas>
<Image x:Name="image" Height="38" Canvas.Left="10" Canvas.Top="10" Width="38" Source="C:\Users\user\Documents\Visual Studio 2015\Projects\Vorschau\Vorschau\img\coordinatesWhite.png"/>
<Label x:Name="lbLogoname" Content="Vorschaukomponente" Canvas.Left="37" Canvas.Top="10" Width="143" FontWeight="Bold" Foreground="White"/>
</Canvas>
</Grid>
</Border>
</Window>
you can use Listbox , to show group of buttons
Solution 1 :
<Style TargetType="{x:Type ListBox}">
<Setter Property="ListBox.ItemTemplate">
<Setter.Value>
<DataTemplate>
<ToggleButton Content="{Binding}"
IsChecked="{Binding IsSelected, Mode=TwoWay, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ListBoxItem}}}"
/>
</DataTemplate>
</Setter.Value>
</Setter>
</Style>
Solution 2
Use radio button change the template
<RadioButton Content="Point" >
<RadioButton.Template>
<ControlTemplate>
<ToggleButton IsChecked="{Binding IsChecked, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}"
Content="{Binding Content, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}"/>
</ControlTemplate>
</RadioButton.Template>
</RadioButton>
So I know there are similar questions out there but I'm still confused and hope someone can help me. i had a listbox with the ability to select an item and it would add a property. I now have a context menu as the layout is exactly what I need but I'm struggling to make my click event work, currently I can't do anything with mine just now, but I have the code for the code behind on the list box to work, can someone help me with having the lsitbox click event work on the context menu please :)?
private void Selector_OnSelectionChanged(object sender, SelectionChangedEventArgs e)
{
var listBox = sender as ListBox;
if (listBox.SelectedItems.Count == 0)
{
return;
}
var item = listBox.SelectedItems[0] as PropertyNode;
viewModel.AddPropertyNode(item);
}
Edit
Here is my XAML that I have with my context menu just now
<DataTemplate x:Key="AddNodeTemplate">
<Border BorderThickness="1" Background="#F7F7F7">
<Border.BorderBrush>
<DrawingBrush Viewport="8,8,8,8" ViewportUnits="Absolute" TileMode="Tile">
<DrawingBrush.Drawing>
<DrawingGroup>
<GeometryDrawing Brush="#F7F7F7">
<GeometryDrawing.Geometry>
<GeometryGroup>
<RectangleGeometry Rect="0,0,50,50"/>
<RectangleGeometry Rect="50,50,50,50"/>
</GeometryGroup>
</GeometryDrawing.Geometry>
</GeometryDrawing>
</DrawingGroup>
</DrawingBrush.Drawing>
</DrawingBrush>
</Border.BorderBrush>
<StackPanel>
<Button x:Name="ButtonAdd" Click="ButtonAdd_Click" Height="30" Width="130" Tag="{Binding RelativeSource={RelativeSource AncestorType={x:Type syncfusion:Node}}}">
<Button.Style>
<Style TargetType="Button">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Grid Background="#F7F7F7">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="25"/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Image Source="Images/icon_plus.bmp" HorizontalAlignment="Left" Margin="5,0,0,0"/>
<TextBlock Text="Add Property" HorizontalAlignment="Center" Grid.Column="1" VerticalAlignment="Center" Foreground="LightGray" FontStyle="Italic" FontSize="12"/>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
<Setter Property="Background" Value="#F7F7F7"/>
</Style>
</Button.Style>
<Button.ContextMenu>
<ContextMenu>
<MenuItem Header="_Copy Existing" Icon="{StaticResource ImageCopy}" ItemsSource="{Binding Path=AvailableProperties}" Click="MenuItem_Click">
<MenuItem.Resources>
<Style TargetType="MenuItem">
<Style.Resources>
<Image x:Key="img" x:Shared="False" Width="12" Height="12" Source="{Binding Icon, Converter={StaticResource ImageToSourceConverter}}"
Margin="3" VerticalAlignment="Center"/>
<Style TargetType="ContentPresenter">
<Style.Triggers>
<Trigger Property="ContentSource" Value="Icon">
<Setter Property="ContentTemplate">
<Setter.Value>
<DataTemplate>
<Image Source="{Binding}"/>
</DataTemplate>
</Setter.Value>
</Setter>
</Trigger>
</Style.Triggers>
</Style>
</Style.Resources>
<Setter Property="Icon" Value="{Binding Icon, Converter={StaticResource ImageToSourceConverter}}"/>
<Style.Triggers>
<Trigger Property="Role" Value="SubMenuItem">
<Setter Property="HeaderTemplate">
<Setter.Value>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<ContentPresenter Content="{Binding Name}"/>
</StackPanel>
</DataTemplate>
</Setter.Value>
</Setter>
</Trigger>
</Style.Triggers>
</Style>
</MenuItem.Resources>
</MenuItem>
<MenuItem Header="Upscale well logs"/>
<MenuItem Header="Upscale well_top attributes"/>
<MenuItem Header="Upscale point attributes" Icon="{StaticResource ImagePointSet}">
</MenuItem>
<MenuItem Header="Calculate"/>
</ContextMenu>
</Button.ContextMenu>
</Button>
</StackPanel>
</Border>
</DataTemplate>
Code behind for context menu, I know it's not much but this is as far as I can get
private void MenuItem_Click(object sender, RoutedEventArgs e)
{
var menuItem = sender as MenuItem;
}
Current output
Please verify that you've correctly linked your code in the XAML. Something like:
<ListView SelectionChanged="Selector_OnSelectionChanged">
I note that we don't see any of your wpf xaml code. If this doesn't answer your question then it might help to add a glimpse of your xaml so we can identify why your Selector_OnSelectionChanged isn't being processed.
Thanks!
After much googling and asking around I found an answer and thought I post it for anyone who might have this problem also, just it's in the form of my problem, which should be easy enough to edit :)
<DataTemplate x:Key="AddNodeTemplate">
<Border BorderThickness="1" Background="#F7F7F7">
<Border.BorderBrush>
<DrawingBrush Viewport="8,8,8,8" ViewportUnits="Absolute" TileMode="Tile">
<DrawingBrush.Drawing>
<DrawingGroup>
<GeometryDrawing Brush="#F7F7F7">
<GeometryDrawing.Geometry>
<GeometryGroup>
<RectangleGeometry Rect="0,0,50,50"/>
<RectangleGeometry Rect="50,50,50,50"/>
</GeometryGroup>
</GeometryDrawing.Geometry>
</GeometryDrawing>
</DrawingGroup>
</DrawingBrush.Drawing>
</DrawingBrush>
</Border.BorderBrush>
<StackPanel>
<Button x:Name="ButtonAdd" Click="ButtonAdd_Click" Height="30" Width="130" Tag="{Binding RelativeSource={RelativeSource AncestorType={x:Type syncfusion:Node}}}">
<Button.Style>
<Style TargetType="Button">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Grid Background="#F7F7F7">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="25"/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Image Source="Images/icon_plus.bmp" HorizontalAlignment="Left" Margin="5,0,0,0"/>
<TextBlock Text="Add Property" HorizontalAlignment="Center" Grid.Column="1" VerticalAlignment="Center" Foreground="LightGray" FontStyle="Italic" FontSize="12"/>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
<Setter Property="Background" Value="#F7F7F7"/>
</Style>
</Button.Style>
<Button.ContextMenu>
<ContextMenu>
<MenuItem Header="Copy Exisiting" ItemsSource="{Binding Path=AvailableProperties}" Click="AddExistingProperty_OnClick" Icon="Images/Copy.bmp" FontFamily="MS Reference Sans Serif">
<MenuItem.Resources>
<Style TargetType="MenuItem">
<Style.Resources>
<Image x:Key="img" x:Shared="False" Width="10" Height="10" Source="{Binding Icon, Converter={StaticResource ImageToSourceConverter}}"
Margin="3" VerticalAlignment="Center"/>
<Style TargetType="ContentPresenter">
<Style.Triggers>
<Trigger Property="ContentSource" Value="Icon">
<Setter Property="ContentTemplate">
<Setter.Value>
<DataTemplate>
<Image Source="{Binding}"/>
</DataTemplate>
</Setter.Value>
</Setter>
</Trigger>
</Style.Triggers>
</Style>
</Style.Resources>
<Setter Property="Icon" Value="{Binding Icon, Converter={StaticResource ImageToSourceConverter}}"/>
<Style.Triggers>
<Trigger Property="Role" Value="SubMenuItem">
<Setter Property="HeaderTemplate">
<Setter.Value>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<ContentPresenter Content="{Binding Name}"/>
</StackPanel>
</DataTemplate>
</Setter.Value>
</Setter>
</Trigger>
</Style.Triggers>
</Style>
</MenuItem.Resources>
</MenuItem>
<MenuItem Header="Upscale well logs" Click="AddProperty_OnClick" Tag="UpscaleWellLogs" Style="{StaticResource MenuItemIcon}" Icon="Images/WellLogs.png" FontFamily="MS Reference Sans Serif"/>
<MenuItem Header="Upscale well top attributes" Click="AddProperty_OnClick" Tag="UpscaleWellTopAttributes" Style="{StaticResource MenuItemIcon}" Icon="Images/WellTop.png" FontFamily="MS Reference Sans Serif"/>
<MenuItem Header="Upscale point attributes" Click="AddProperty_OnClick" Tag="UpscalePointAttributes" Style="{StaticResource MenuItemIcon}" Icon="Images/PointSet.png" FontFamily="MS Reference Sans Serif"/>
<MenuItem Header="Calculate" Click="AddProperty_OnClick" Tag="Calculate" Style="{StaticResource MenuItemIcon}" Icon="Images/calculator.png" FontFamily="MS Reference Sans Serif"/>
</ContextMenu>
</Button.ContextMenu>
</Button>
</StackPanel>
</Border>
</DataTemplate>
private void AddExistingProperty_OnClick(object sender, RoutedEventArgs e)
{
var menuItem = e.OriginalSource as MenuItem;
var item = menuItem.DataContext as PropertyNode;
viewModel.AddPropertyNode(item);
}
private void AddProperty_OnClick(object sender, RoutedEventArgs e)
{
if (MenuItemActivated != null)
{
var menuItem = sender as MenuItem;
var command = menuItem.Tag as CognitiveTreeMenuCommand?;
if (command.HasValue)
{
MenuItemActivated(this, new MenuItemEventHandlerArgs() { Command = command.Value });
}
}
}
I got a TabControl with two TabItems, I created a template for it.
<TabControl x:Name="MainInfoTabControl" Grid.Row="3" Grid.RowSpan="7" Grid.Column="0" Grid.ColumnSpan="2"
Background="{x:Null}"
BorderBrush="{x:Null}"
>
<TabControl.Resources>
<Style x:Key="TabHeaderStyle" TargetType="{x:Type TabItem}">
<Setter Property="Background" Value="{x:Null}" />
<Setter Property="FontWeight" Value="DemiBold" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type TabItem}">
<Border x:Name="HeaderBorder" BorderBrush="White" BorderThickness="2" CornerRadius="10,10,0,0" >
<TextBlock Text="" VerticalAlignment="Center" Margin="5"></TextBlock>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</TabControl.Resources>
<TabItem Header="Main Details"
Margin="0.5, 0.5, 0, 0.5"
FontSize="15"
MinHeight="40" Width="200"
Style="{StaticResource TabHeaderStyle}"
>
</TabItem>
<TabItem Header="Pets Owned"
Margin="0.5, 0.5, 0, 0.5"
FontSize="15"
MinHeight="40" Width="200"
Style="{StaticResource TabHeaderStyle}"
>
</TabItem>
</TabControl>
The problem is the tabItem's Header doesn't show up. In my template there is a TextBlock but i couldn't customize the TextBlock.Text dynamically (atleast bind or somewhat change the Text property during run time)
TabItem1 should be "Owner Details" while TabItem2 should be "Pets Owned"
You override default tabitem template you need to get somehow to parent's value.
<TextBlock Text="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Header}"
VerticalAlignment="Center"
Margin="5">
</TextBlock>
or
<TextBlock Text="{TemplateBinding Property=Header}"
VerticalAlignment="Center"
Margin="5">
</TextBlock>