How create style from Grid with textblocks - wpf

i have grid like this:
<Grid Height="100" Width="580" Margin="10,402,10,48">
<TextBlock Text="0-10 V" FontWeight="Bold" Style="{DynamicResource TextBlockStyle}" Width="100" Height="25" Margin="10,10,470,65"/>
<TextBlock Text="Czestotliwosc:" Style="{DynamicResource TextBlockStyle}" Width="110" Height="25" Margin="10,40,460,35"/>
<TextBlock Text="0 Hz" FontWeight="Bold" Style="{DynamicResource TextBlockStyle}" Width="100" Height="25" Margin="135,40,345,35"/>
<TextBlock Text="Stan czujnika:" Style="{DynamicResource TextBlockStyle}" Width="120" Height="25" Margin="10,70,450,5"/>
<TextBlock Text="brak" FontWeight="Bold" Style="{DynamicResource TextBlockStyle}" Width="100" Height="25" Margin="0,70,345,5" HorizontalAlignment="Right"/>
</Grid>
And create style like this:
<Style x:Key="NamurSensorNamur" TargetType="Grid">
<Setter Property="Height" Value="100"/>
<Setter Property="Width" Value="580"/>
</Style>
But i dont know how property had I to use to declarate this textblocks.
I the future i want create dynamiclly this grid by
Style={DynamicResource NamurSensorNamur}

Related

Apply styles to wpf Custom calendars

I have a calendar created as follows
<Grid>
<Rectangle Margin="2" Height="25" Name="borderRectangle" VerticalAlignment="Top" Fill="#FFEAEEF9" />
<Button Name="titleButton" Style="{StaticResource ButtonStyle}" Margin="30,1,30,0" FlowDirection="RightToLeft" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" Padding="0" Focusable="True" Click="titleButton_Click" Height="25" VerticalAlignment="Top" FontWeight="Bold" IsTabStop="True" TabIndex="0">خرداد 1397</Button>
<Button Name="previousButton" Style="{StaticResource ButtonStyle}" Height="25" HorizontalAlignment="Right" Margin="0,2,12,0" VerticalAlignment="Top" Width="23" Background="Transparent" BorderThickness="0" Padding="0" FontFamily="Arial" FontSize="14" BorderBrush="Transparent" Click="previousButton_Click" VerticalContentAlignment="Center" HorizontalContentAlignment="Center" IsTabStop="True" TabIndex="0">►</Button>
<Button Name="nextButton" Style="{StaticResource ButtonStyle}" Height="25" HorizontalAlignment="Left" Margin="12,2,0,0" VerticalAlignment="Top" Width="23" Background="Transparent" BorderThickness="0" Padding="0" FontFamily="Arial" FontSize="14" VerticalContentAlignment="Center" HorizontalContentAlignment="Center" BorderBrush="Transparent" Click="nextButton_Click" IsTabStop="True" TabIndex="0">◄</Button>
<UniformGrid Margin="3,26,3,2" Name="monthUniformGrid" Rows="7" Columns="7" FlowDirection="RightToLeft" />
<UniformGrid Margin="3,26,3,2" Name="yearUniformGrid" Columns="3" Rows="4" FlowDirection="RightToLeft" />
<UniformGrid Margin="3,26,3,2" Name="decadeUniformGrid" Columns="3" Rows="4" FlowDirection="RightToLeft" />
</Grid>
And the result is this way
Now I have another calendar control that has beautiful styles I have access to styles, but when I apply it, I get an error
Style="{StaticResource CalendarBaseStyle}"
calendar target type does not match type of element...
and this is my style
<Style x:Key="CalendarBaseStyle" TargetType="{x:Type Calendar}">
<Setter Property="Foreground" Value="White" />
<Setter Property="Background" Value="White" />
<Setter Property="BorderBrush" Value="{DynamicResource BorderBrush}" />
...
As you can see, my calendar is made by Uniform Grid So how can I apply the calendar style to it?
Change the style target type to type of your control, for example:
xmlns:myControls="clr-namespace:MyNamespace.Controls"
....
<Style x:Key="CalendarBaseStyle" TargetType="{x:Type myControls:MyCalendarControl}">
....

How to hide field based on condition check in wpf?

I am trying to hide the Textbox inside the list view based on a condition.
<ListView Margin="0" Name="lvAccessPoints" Background="#ff1d1d1d" Grid.Row="1" BorderThickness="0">
<ListView.ItemTemplate>
<DataTemplate>
<WrapPanel>
<iconPacks:PackIconModern Kind="ConnectionWifi" Foreground="White" Width="30" Height="30"/>
<TextBlock Text="{Binding Name}" FontWeight="Bold" Foreground="White" Padding="10,0" FontSize="15" VerticalAlignment="Center"/>
<TextBox HorizontalAlignment="Left"
Height="23"
Margin="10,10,0,0"
TextWrapping="Wrap"
Text=""
VerticalAlignment="Top"
Width="120"
TextChanged="TextBox_TextChanged"
Visibility="{Binding Name!=SelectedItem.Name ? Hidden : Visible}"/>
<Button Click="Button_Click_2"></Button>
</WrapPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
I am trying like this , and its not seems to be the right way, what i want is when the particular name in the loop matches the selected items name, then only TextBox should show.
What I am doing wrong?
These kind of expressions are not supported in XAML:
Visibility="{Binding Name!=SelectedItem.Name ? Hidden : Visible}"
What you could do is to define a DataTrigger in your DataTemplate that sets the Visibility property of the TextBox to Visible when the parent ListViewItem is selected:
<ListView Margin="0" Name="lvAccessPoints" Background="#ff1d1d1d" Grid.Row="1" BorderThickness="0">
<ListView.ItemTemplate>
<DataTemplate>
<WrapPanel>
<iconPacks:PackIconModern Kind="ConnectionWifi" Foreground="White" Width="30" Height="30"/>
<TextBlock Text="{Binding Name}" FontWeight="Bold" Foreground="White" Padding="10,0" FontSize="15" VerticalAlignment="Center"/>
<TextBox HorizontalAlignment="Left"
x:Name="txt"
Height="23"
Margin="10,10,0,0"
TextWrapping="Wrap"
Text=""
VerticalAlignment="Top"
Width="120"
TextChanged="TextBox_TextChanged"
Visibility="Hidden"/>
<Button Click="Button_Click_2"></Button>
</WrapPanel>
<DataTemplate.Triggers>
<DataTrigger Binding="{Binding Path=IsSelected, RelativeSource={RelativeSource FindAncestor, AncestorType=ListViewItem}}" Value="True">
<Setter TargetName="txt" Property="Visibility" Value="Visible" />
</DataTrigger>
</DataTemplate.Triggers>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>

can't move wrap panel and listbox to mainwindow

I have a popUp and inside this popUp there is a wrap panel and a listbox(even without wrappanel situation is the same) I want it to be inside the main window but I can't move it there! it returns off the margins, how to fix it?
<Window x:Class="MyHeroEditor.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:MyHeroEditor"
Title="MainWindow" Height="635.075" Width="796.643"
WindowState="Maximized"
Background="Bisque">
<Window.Resources>
<Style TargetType="ListBox" x:Key="listbox" >
<Setter Property="Height" Value="250"/>
<Setter Property="Width" Value="250" />
</Style>
<Style TargetType="Button" x:Key="Button" >
<Setter Property="Height" Value="40"/>
<Setter Property="Width" Value="55" />
</Style>
<Style TargetType="WrapPanel" x:Key="Panel" >
<Setter Property="Height" Value="250"/>
<Setter Property="Width" Value="250" />
</Style>
<Style TargetType="Image" x:Key="Image" >
<Setter Property="Height" Value="70"/>
<Setter Property="Width" Value="70" />
</Style>
</Window.Resources>
<Window.DataContext>
<local:Collections/>
</Window.DataContext>
<Canvas Name="Hero" Drop="HeroDrop" AllowDrop="True" Margin="0,0,-8,-4"
>
<WrapPanel
x:Name="HelmetPanel" Style="{StaticResource Panel}" Height="Auto" Width="Auto" />
<Button
Click="Export" Style="{StaticResource Button}" Canvas.Left="264"
Canvas.Top="389" >Export
</Button>
<Button
Click="Open" Content="Open" Style="{StaticResource Button}" Canvas.Left="15" Canvas.Top="389" />
<Button
Click="Save" Style="{StaticResource Button}" Canvas.Left="179" Canvas.Top="389" >Save
</Button>
<Button
AllowDrop="True" Style="{StaticResource Button}" Click="Helmet_Button_Click" Canvas.Left="415" Canvas.Top="26" >Шлемы
</Button>
<Button
AllowDrop="True" Style="{StaticResource Button}" Click="Armature_Button_Click" Canvas.Left="524" Canvas.Top="26" >Броня
</Button>
<Button
AllowDrop="True" Style="{StaticResource Button}" Click="Weapon_Button_Click" Canvas.Left="615" Canvas.Top="26" >Оружие
</Button>
<Button
Click="Create" Content="Create" Style="{StaticResource Button}" Canvas.Left="90" Canvas.Top="389" />
<Button
AllowDrop="True" Style="{StaticResource Button}" Click="Gloves_Button_Click" Canvas.Left="727" Canvas.Top="26" Content="Перчатки" Width="59" />
<Button
AllowDrop="True" Style="{StaticResource Button}" Click="Boots_Button_Click" Canvas.Left="824" Canvas.Top="26" Content="Сапоги" />
<Popup
Name="HelmetsPopUp" StaysOpen="False" Placement="Mouse">
<ListBox x:Name="listhelmets" Style="{StaticResource listbox}" ItemsSource="{Binding ListHelmets}"
IsSynchronizedWithCurrentItem="True" PreviewMouseDown="helmet_MouseDown" MouseDown="helmet_MouseDown"
DragLeave="helmet_DragLeave" MouseUp="Listhelmets_OnMouseUp"
SelectedValuePath="protection" >
<ListBox.ItemTemplate >
<DataTemplate >
<StackPanel Orientation="Horizontal">
<Image Source="{Binding Image}" Style="{StaticResource Image}"/>
<TextBox Height="30" Width="30" Text="{Binding protection}"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Popup>
<Popup
Name="ArmaturePopUp" StaysOpen="False" Placement="Mouse" >
<ListBox x:Name="listarmature" Style="{StaticResource listbox}" ItemsSource="{Binding ListArmature}"
IsSynchronizedWithCurrentItem="True" MouseDown="armature_MouseDown" MouseUp="Listarmature_OnMouseUp"
PreviewMouseMove="armature_PreviewMouseMove" SelectedValuePath="protection" DragLeave="armature_DragLeave"
Canvas.Left="271" Canvas.Top="51">
<ListBox.ItemTemplate >
<DataTemplate >
<StackPanel Orientation="Horizontal">
<Image Source="{Binding Image}" Style="{StaticResource Image}"/>
<TextBox Height="30" Width="30" Text="{Binding protection}"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Popup>
<Popup
Name="WeaponPopUp" StaysOpen="False" Placement="Mouse" >
<WrapPanel
Name="WeaponPanel" Style="{StaticResource Panel}">
<ListBox x:Name="listweapons" Style="{StaticResource listbox}" ItemsSource="{Binding ListWeapon}"
IsSynchronizedWithCurrentItem="True" MouseDown="weapon_MouseDown" MouseUp="Listweapons_OnMouseUp"
DragLeave="weapons_DragLeave"
PreviewMouseMove="weapons_PreviewMouseMove" SelectedValuePath="attack">
<ListBox.ItemTemplate >
<DataTemplate >
<StackPanel Orientation="Horizontal">
<Image Source="{Binding Image}" Style="{StaticResource Image}"/>
<TextBox Height="30" Width="30" Text="{Binding _attack}"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</WrapPanel>
</Popup>
<TextBox x:Name="TextBox2" Canvas.Left="29" Canvas.Top="312" Height="55" Width="130" />
<Button
Click="Reset" Style="{StaticResource Button}" Content="reset" Canvas.Left="219" Canvas.Top="327" />
<WrapPanel Height="261" Width="264" Canvas.Left="29" Canvas.Top="15">
<ListBox x:Name="listHero" Height="237" Width="100" Style="{StaticResource listbox}" ItemsSource="{Binding ListHero}"
AllowDrop="True" >
<ListBox.ItemTemplate >
<DataTemplate >
<StackPanel Orientation="Horizontal">
<Image Source="{Binding Image}" Style="{StaticResource Image}"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</WrapPanel>
<Popup Name="GlovesPopUp" StaysOpen="False">
<Canvas>
<ListBox x:Name="listgloves" Height="237" Width="131" Style="{StaticResource listbox}" ItemsSource="{Binding ListGloves}"
AllowDrop="True" Canvas.Left="723" Canvas.Top="-519" >
<ListBox.ItemTemplate >
<DataTemplate >
<StackPanel Orientation="Horizontal">
<Image Source="{Binding Image}" Style="{StaticResource Image}"/>
<TextBox Height="30" Width="30" Text="{Binding protection}"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Canvas>
</Popup>
<Popup Name="BootsPopUp" StaysOpen="False">
<ListBox x:Name="listboots" Height="237" Width="137" Style="{StaticResource listbox}" ItemsSource="{Binding ListBoots}"
AllowDrop="True" Canvas.Left="634" Canvas.Top="104" >
<ListBox.ItemTemplate >
<DataTemplate >
<StackPanel Orientation="Horizontal">
<Image Source="{Binding Image}" Style="{StaticResource Image}"/>
<TextBox Height="30" Width="30" Text="{Binding _attack}"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Popup>
</Canvas>
</Window>
Try using the XAML editor instead of the Visual Editor as the Visual one tends to glitch in certain situations.
You should move your controls between these elements:
<Window x:Class="WPFSO.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Grid>
<Grid>**Add your controls here**</Grid>
</Grid>
</Window>
My guess is you have something outside the second (inner) grid or a similar issue.
You can play with the following properties of Popup [or Tooltip] control to specify its position when it opens:
PlacementTarget (to change popup placement target):
Sample:
<Canvas Margin="5" Background="Red" Width="200" Height="150" >
<Ellipse Name="ellipse1"
Canvas.Top="60" Canvas.Left="50"
Height="85" Width="60"
Fill="Black"/>
<Popup IsOpen="True" PlacementTarget="{Binding ElementName=ellipse1}">
<TextBlock Background="LightBlue" FontSize="18">This is a Popup</TextBlock>
</Popup>
</Canvas>
Placement (Its value type is PlacementMode. A PlacementMode enumeration value that determines the orientation of the Popup control when the control opens, and that specifies how the control interacts with screen boundaries. The default is Bottom.)
Sample:
<Canvas Width="200" Height="150">
<Image Name="image1"
Canvas.Left="75"
Source="Water_lilies.jpg" Height="200" Width="200"/>
<Popup IsOpen="True" PlacementTarget="{Binding ElementName=image1}"
Placement="Bottom">
<TextBlock FontSize="14" Background="LightGreen">Placement=Bottom</TextBlock>
</Popup>
<Popup IsOpen="True" PlacementTarget="{Binding ElementName=image1}"
Placement="Top">
<TextBlock FontSize="14" Background="LightGreen">Placement=Top</TextBlock>
</Popup>
<Popup IsOpen="True" PlacementTarget="{Binding ElementName=image1}"
Placement="Left">
<TextBlock FontSize="14" Background="LightGreen">Placement=Left</TextBlock>
</Popup>
<Popup IsOpen="True" PlacementTarget="{Binding ElementName=image1}"
Placement="Right">
<TextBlock FontSize="14" Background="LightGreen">Placement=Right</TextBlock>
</Popup>
</Canvas>
HorizontalOffset
VerticalOffset
PlacementRectangle
Additional samples and info:
How to: Set the Placement Property for a Popup or Tooltip
Same problem and answer: Keep popup within window bounds:
Before:
After:

Change Image on IsSelected TabControl

I want to be able to change the image of the tabItem when it is selected but I'm really struggling at the moment to understand how others implement use of styles, templates and triggers.
I have this so far:
<TabControl HorizontalAlignment="Left" Height="386" VerticalAlignment="Top" Width="600" TabStripPlacement="Left" Background="{x:Null}" BorderBrush="{x:Null}" Foreground="{x:Null}">
<TabItem Header="TabItem" BorderBrush="{x:Null}" Foreground="{x:Null}" Margin="-2,-2,-1,-28" Width="40" Height="59" HorizontalAlignment="Center" VerticalAlignment="Center">
<TabItem.Background>
<ImageBrush ImageSource="myImageLocation" Stretch="Uniform"/>
</TabItem.Background>
<Grid/>
</TabItem>
<TabItem Header="TabItem" Margin="0,89,0,-89" BorderBrush="{x:Null}" Foreground="{x:Null}" Height="51" HorizontalAlignment="Center" Width="43">
<TabItem.Background>
<ImageBrush ImageSource="myImageLocation" Stretch="Uniform"/>
</TabItem.Background>
<Grid/>
</TabItem>
I have set the image as the background of the tabItem headers.
Take a look at following example:
<TabControl>
<TabControl.Resources>
<DataTemplate x:Key="tabItemGeneralHeaderTemplate">
<StackPanel Orientation="Horizontal" Margin="0,-3,0,0">
<Image Name="tabGeneralImg" Source="Image/tabGeneralActive.png" Width="11" Height="11"></Image>
<Label Name="tabGeneralLbl" Content="General"></Label>
</StackPanel>
<DataTemplate.Triggers>
<DataTrigger Binding="{Binding Path=IsSelected,RelativeSource={RelativeSource TemplatedParent}}" Value="True">
<Setter TargetName="tabGeneralImg" Property="Source" Value="Images/tabGeneral.png"/>
</DataTrigger>
</DataTemplate.Triggers>
</DataTemplate>
</TabControl.Resources>
<TabItem Name="tabItemGeneral" HeaderTemplate="{StaticResource tabItemGeneralHeaderTemplate}">
<Grid>
...
</Grid>
</TabItem>
</TabControl>
Just change the source property of the images to some path in your file system and you should do fine :)

How can I wrap a custom text?

I have a listbox that uses datatemplates and one of the elements in the template is a textblock. Problem is that the words won't wrap, and I don't want to set a fixed size. Anybody that knows how to resolve this problem? It's driving me crazy!
<ListBox Grid.Row=" 1" HorizontalContentAlignment="Stretch" Background="#24221f" ItemsSource="{Binding Messages}" ScrollViewer.VerticalScrollBarVisibility="Visible" ClipToBounds="False" BorderBrush="{x:Null}">
<ListBox.ItemTemplate>
<DataTemplate >
<Border BorderBrush="#24221f" BorderThickness="3" Width=" auto">
<DockPanel Background="{StaticResource blackBackground}" HorizontalAlignment="Stretch" Width="auto">
<Border BorderThickness="3" BorderBrush="Transparent">
<Image Source="{Binding IconImageUrl}" VerticalAlignment="top" Height="22" Width ="22" DockPanel.Dock="Left" />
</Border>
<Border BorderThickness="3" BorderBrush="LightGray" Height="auto" Width="auto" HorizontalAlignment="Left" VerticalAlignment="Center" DockPanel.Dock="Left">
<Image Source="{Binding ProfileImageUrl}" VerticalAlignment="Top" HorizontalAlignment="Left" Height="48" Width ="48" />
</Border>
<StackPanel Orientation="Vertical" DockPanel.Dock="Left" Margin="5,0,0,0">
<Label Content="{Binding Path=Sender}" Foreground="#feb41c" FontFamily="Verdana" FontWeight="Bold" FontSize="14" />
<TextBlock Width="100" Text="{Binding Path=ShortMessage}" Margin="10,0,0,0" Foreground="BlanchedAlmond" TextWrapping="Wrap" FontFamily="Verdana" />
<Label Content="{Binding Path=Time}" Margin="10,0,0,0" Foreground="DarkGray" FontFamily="Verdana" FontStyle="Italic"/>
</StackPanel>
</DockPanel>
</Border>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
StackPanel is Evil :=) when i have strange behaviours in a xaml which include StackPanel, switching to a Grid with right parameters ( fixed sized, or stars or "Auto" ) often fix the issue.
Note also that there is an error in your xaml since you set the DockPanel.Dock of your first image (IconImageUrl) whereas it is in the border that surrrounds it that you should be setting it. That may get the Layout to do strange things.
just try with HorizontalContentAlignment property to "Stretch" of ListBoxItems using the Style
<Style TargetType="{x:Type ListBoxItem}" >
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
</Style>
and also disable the HorizontalScrollBar visibility
ScrollViewer.HorizontalScrollBarVisibility="Disabled"
Update
<Window.Resources>
<SolidColorBrush x:Key="blackBackground" Color="Black"/>
<Style TargetType="{x:Type ListBoxItem}" >
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
</Style>
</Window.Resources>
<Grid>
<ListBox Grid.Row=" 1" HorizontalContentAlignment="Stretch" Background="#24221f" ScrollViewer.HorizontalScrollBarVisibility="Disabled"
ItemsSource="{Binding Messages}" ScrollViewer.VerticalScrollBarVisibility="Visible" ClipToBounds="False" BorderBrush="{x:Null}">
<ListBox.ItemTemplate>
<DataTemplate >
<Border BorderBrush="#24221f" BorderThickness="3" Width=" auto">
<DockPanel Background="{StaticResource blackBackground}" HorizontalAlignment="Stretch" Width="auto">
<Border BorderThickness="3" BorderBrush="Transparent">
<Image Source="{Binding IconImageUrl}" VerticalAlignment="top" Height="22" Width ="22" DockPanel.Dock="Left" />
</Border>
<Border BorderThickness="3" BorderBrush="LightGray" Height="auto" Width="auto" HorizontalAlignment="Left" VerticalAlignment="Center" DockPanel.Dock="Left">
<Image Source="{Binding ProfileImageUrl}" VerticalAlignment="Top" HorizontalAlignment="Left" Height="48" Width ="48" />
</Border>
<StackPanel Orientation="Vertical" DockPanel.Dock="Left" Margin="5,0,0,0">
<Label Content="{Binding Path=Sender}" Foreground="#feb41c" FontFamily="Verdana" FontWeight="Bold" FontSize="14" />
<TextBlock Text="{Binding Path=ShortMessage}" Margin="10,0,0,0" Foreground="BlanchedAlmond" TextWrapping="Wrap" FontFamily="Verdana" />
<Label Content="{Binding Path=Time}" Margin="10,0,0,0" Foreground="DarkGray" FontFamily="Verdana" FontStyle="Italic"/>
</StackPanel>
</DockPanel>
</Border>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
I think this thread answer's your question, see the accespted answer by "Nash" - Force TextBlock to wrap in WPF ListBox
( and remember to upvote the answer the the linked thread if it helps you :) )

Resources