I'm trying to transfer list from mainview to user control. My solution doesn't work. Everything works fine except for the transferring the list.
My user control:
public List<Song> ListIWantTransferFromMainviewToUsercontrol = new List<Song>();
public View_Playlist()
{
InitializeComponent();
ToPlayList.ItemsSource = ListIWantTransferFromMainviewToUsercontrol;
ToPlayList.Items.Refresh();
}
My mainview:
var i = Playlists_ListBox.Items.IndexOf(Playlists_ListBox.SelectedItem);
string y = Playlists[i].Title;
var z = Playlists[i].Songs;
View_Playlist view_Playlist = new View_Playlist
{
ListIWantTransferFromMainviewToUsercontrol = z
};
this.contentControl.Content = view_Playlist;
I should click on item in listbox shown by mainview and run this code on click. Has anyone working solution for my problem? Thanks for reply.
User control XAML, listbox part:
<ListBox Name="ToPlayList" Grid.Column="1" Grid.ColumnSpan="2" Grid.Row="4" Background="{x:Null}" >
<ListBox.ItemContainerStyle>
<Style TargetType="ListBoxItem">
<Setter Property="BorderBrush" Value="BlanchedAlmond" />
<Setter Property="BorderThickness" Value="0" />
<Style.Triggers>
<Trigger Property="IsSelected" Value="True">
<Setter Property="Background" Value="Gray" />
<Setter Property="BorderThickness" Value="2" />
</Trigger>
<Trigger Property="IsMouseCaptured" Value="True">
<Setter Property="BorderThickness" Value="2" />
<Setter Property="Background" Value="Gray" />
</Trigger>
</Style.Triggers>
</Style>
</ListBox.ItemContainerStyle>
<ListBox.ItemTemplate>
<DataTemplate>
<Grid Margin="0,2" >
<Grid.ColumnDefinitions>
<ColumnDefinition Width="30"/>
<ColumnDefinition Width="205"/>
<ColumnDefinition Width="90" />
<ColumnDefinition Width="90" />
<ColumnDefinition Width="35" />
</Grid.ColumnDefinitions>
<CheckBox/>
<TextBlock Grid.Column="1" Text="{Binding SongTitle}" Foreground="White"/>
<TextBlock Grid.Column="2" Text="{Binding SongArtist}" Foreground="White"/>
<TextBlock Grid.Column="3" Text="{Binding SongDate}" Foreground="White"/>
<TextBlock Grid.Column="4" Text="{Binding Duration}" Foreground="White"/>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
I solved it by parameter. It isn't ideal, but working.
Related
I've formatted a ComboBox to display each item's details, please don't take the design as final, it's just an example:
But as you can see, the displayed item (Inside the box with the arrow) is broken:
So I need to format that component too, to display only the Server value in that box. I've tried to find the correct element, and even managed to find a way to reformat the whole combo box, but no way to add a template for the data display inside that box.
How do I edit the data template for that container? This is the result I'd expect:
<ComboBox x:Name="cboSourceMySql" Grid.Column="1" Margin="5,0,5,0" ItemsSource="{Binding OdbcDataSources, Mode=TwoWay}" Grid.Row="1" >
<ComboBox.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="50" />
<ColumnDefinition Width="1*" />
<ColumnDefinition Width="50" />
<ColumnDefinition Width="1*" />
</Grid.ColumnDefinitions>
<Label Content="Server:" Grid.Column="0" Grid.Row="0" />
<TextBlock Text="{Binding Server}" VerticalAlignment="Center" Grid.Column="1" Grid.Row="0" />
<Label Content="Driver:" Grid.Column="0" Grid.Row="1" />
<TextBlock Text="{Binding Driver}" VerticalAlignment="Center" Grid.Column="1" Grid.Row="1" />
</Grid>
</DataTemplate>
</ComboBox.ItemTemplate>
</ComboBox>
From the article WPF Combobox: Different template in textbox and drop-downlist
I think you can use the below style
<ComboBox
x:Name="cboSourceMySql"
Grid.Column="1" Margin="5,0,5,0"
ItemsSource="{Binding OdbcDataSources, Mode=TwoWay}"
Grid.Row="1" >
<ItemsControl.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Server}" />
</DataTemplate>
</ItemsControl.ItemTemplate>
<ComboBox.ItemContainerStyle>
<Style TargetType="{x:Type ComboBoxItem}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ComboBoxItem}">
<Border
x:Name="Bd"
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}">
<StackPanel Orientation="Vertical">
<Label Content="{Binding Server}" />
<Label Content="{Binding Driver}" />
</StackPanel>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsHighlighted" Value="True">
<Setter TargetName="Bd" Property="Background" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}" />
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.HighlightTextBrushKey}}" />
</Trigger>
<Trigger Property="IsEnabled" Value="False">
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ComboBox.ItemContainerStyle>
</ComboBox>
I created a custom WPF ComboBox like this:
<ComboBox
x:Name="ComboBoxBtn"
VerticalAlignment="Top"
HorizontalAlignment="Left"
Margin="0,0,0,-1"
Width="300"
ItemsSource="{Binding Source, RelativeSource={RelativeSource AncestorType=UserControl}}"
SelectedItem="{Binding Path=Selected, Mode=TwoWay, RelativeSource={RelativeSource AncestorType=UserControl}}"
IsSynchronizedWithCurrentItem="True">
<ComboBox.ItemTemplate>
<DataTemplate>
<ContentControl>
<Style TargetType="ContentControl">
<Style.Triggers>
<DataTrigger Binding="{Binding Favorite}" Value="True">
<Setter Property="Content">
<Setter.Value>
<Grid>
<Grid.Style>
<Style TargetType="Grid">
<Setter Property="Background" Value="#FFE6E6FA"/>
</Style>
</Grid.Style>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<Label Content="{Binding}" Width="250" />
<Button Grid.Column="1" Command="{Binding AddCommandButton, ElementName=root}"
CommandParameter="{Binding}">+</Button>
</Grid>
</Setter.Value>
</Setter>
</DataTrigger>
<DataTrigger Binding="{Binding Favorite}" Value="False">
<Setter Property="Content">
<Setter.Value>
<Grid>
<Grid.Style>
<Style TargetType="Grid">
<Setter Property="Background" Value="Yellow"/>
</Style>
</Grid.Style>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<Label Content="{Binding}" Width="250" />
<Button Grid.Column="1" Command="{Binding RemoveCommandButton, ElementName=root}"
CommandParameter="{Binding}">-</Button>
</Grid>
</Setter.Value>
</Setter>
</DataTrigger>
</Style.Triggers>
</Style>
</ContentControl>
</DataTemplate>
</ComboBox.ItemTemplate>
</ComboBox>
The Source binding contains a ObservableColleciton where the client has a Favorite field and is supposed to show a different background and a different button. But when I open the ComboBox all the items have:
"System.Windows.Styles"
Your problem is you are setting Style as Content in the Content Control.
<ContentControl>
<Style TargetType="ContentControl">
...
</Style>
</ContentControl>
In order to set the style of the content control you should add:
<ContentControl.Style>
So the code above will look like this:
<ContentControl>
<ContentControl.Style>
<Style TargetType="ContentControl">
...
</Style>
<ContentControl.Style>
</ContentControl>
EDIT
By the way your code is very complex for the simple task of changing the background. Here is a simplified version:
<ComboBox.ItemTemplate>
<DataTemplate>
<Grid Name="PART_GRID" Background="Yellow">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<Label Content="{Binding}"
Width="250" />
<Button Name="PART_BUTTON"
Grid.Column="1"
Content="-"
Command="{Binding AddCommandButton, ElementName=root}"
CommandParameter="{Binding}" />
</Grid>
<DataTemplate.Triggers>
<DataTrigger Binding="{Binding Favorite}"
Value="True">
<Setter TargetName="PART_GRID"
Property="Background"
Value="#FFE6E6FA" />
<Setter TargetName="PART_BUTTON"
Property="Content"
Value="+" />
<Setter TargetName="PART_BUTTON"
Property="Command"
Value="{Binding RemoveCommandButton, ElementName=root}" />
</DataTrigger>
</DataTemplate.Triggers>
</DataTemplate>
</ComboBox.ItemTemplate>
In my case, I found that I had:
<ComboBox>
<Style>
</Style>
</ComboBox>
which was directly adding a style as an item, which is similar to the solution above.
I'm trying to change the containing border background color based on the focus property of a contained textbox. Can someone explain what's the problem with my code?
<Border BorderBrush="LightBlue" BorderThickness="2" Background="#33000000">
<Border.Style>
<Style>
<Style.Triggers>
<DataTrigger
Binding="{Binding IsFocused, ElementName=txtValue}"
Value="True">
<Setter Property="Border.Background" Value="Green" />
</DataTrigger>
</Style.Triggers>
</Style>
</Border.Style>
<Grid Margin="0" VerticalAlignment="Center">
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<TextBox Name="txtValue" Grid.Column="0" Text="20" />
<TextBlock Grid.Column="1" />
</Grid>
</Border>
Your DataTrigger is not change the value of the Background property because you set it inside the Border declaration. So, once setted, it will never changed. To allow changing, you have to set the value inside the Style.
<Border BorderBrush="LightBlue" BorderThickness="2" >
<Border.Style>
<Style TargetType="Border">
<Setter Property="Background" Value="#33000000"/>
<Style.Triggers>
<DataTrigger Binding="{Binding IsFocused, ElementName=txtValue}" Value="True">
<Setter Property="Background" Value="Green" />
</DataTrigger>
</Style.Triggers>
</Style>
</Border.Style>
<Grid Margin="0" VerticalAlignment="Center">
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<TextBox Name="txtValue" Grid.Column="0" Text="20" />
<TextBlock Grid.Column="1" />
</Grid>
</Border>
I have a listbox and I want to change the color of every other row. I have tested the following code, but the colors are not changing. Am I missing something?
<ListBox Height="250" BorderThickness="0" ItemsSource="{Binding Path=Results}" AlternationCount="2">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="0" FontFamily="Sagoe UI" FontSize="14" Text="{Binding FirstName, StringFormat='User: {0}'}" Padding="2" />
<TextBlock Grid.Column="1" FontFamily="Sagoe UI" FontSize="14" Text="{Binding Company, StringFormat='Company: {0}'}" Padding="2" />
<TextBlock Grid.Column="2" FontFamily="Sagoe UI" FontSize="14" Text="{Binding Dept, StringFormat='Department: {0}'}" Padding="2" >
</TextBlock>
</Grid>
</DataTemplate>
<ListBox.ItemTemplate>
Here is my style and the closing tags for resoruces and dictionary
<Style TargetType="{x:Type ListBoxItem}">
<Style.Triggers>
<Trigger Property="ItemsControl.AlternationIndex" Value="0">
<Setter Property="Background" Value="#19f39611"></Setter>
</Trigger>
<Trigger Property="ItemsControl.AlternationIndex" Value="1">
<Setter Property="Background" Value="#19000000"></Setter>
</Trigger>
</Style.Triggers>
</Style>
</ResourceDictionary>
</UserControl.Resources>
Wow Forgot I was using RadListBox, so the answer is change the opening and closing Control Tags To
<telerik:RadListBox></telerik:RadListBox>
Then
<Style TargetType="{x:Type telerik:RadListBoxItem}">
<Style.Triggers>
<Trigger Property="ItemsControl.AlternationIndex" Value="0">
<Setter Property="Background" Value="#19f39611"></Setter>
</Trigger>
<Trigger Property="ItemsControl.AlternationIndex" Value="1">
<Setter Property="Background" Value="#19000000"></Setter>
</Trigger>
</Style.Triggers>
</Style>
</ResourceDictionary>
</UserControl.Resources>
I setting the selected item of a list box from the code behind as follows
private void AvailableItem_Click(object sender, RoutedEventArgs e)
{
object clicked = (e.OriginalSource as FrameworkElement).DataContext;
var lbi = AvailableItem.ItemContainerGenerator.ContainerFromItem(clicked) as ListBoxItem;
lbi.IsSelected = true;
}
I have added a trigger as follows to change the selected item background color
<Style.Triggers>
<Trigger Property="IsSelected" Value="True">
<Setter Property="Foreground" Value="White" />
<Setter Property="Background" Value="Black"/>
</Trigger>
</Style.Triggers>
The problem here is that the color does not change as expected. I tried adding trigger for IsSelected value to be false and it works, but IsSelected true is not triggered. I am confused as to why this happens.
EDIT:
Here is the complete binding code:
<ListBox Height="600" Name="AvailableItem" Width="320" Grid.Column="1" ButtonBase.Click="AvailableItem_Click" Background="#00000000" BorderBrush="LightBlue" HorizontalContentAlignment="Stretch">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="2*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<TextBlock Text="{Binding Path = SomeText}" FontSize="14" Foreground="Black" Grid.Column="0" Grid.Row="0" VerticalAlignment="Center" Margin="0,0,0,0"/>
<Button Command="{Binding ElementName=root, Path=DataContext.SomeCommand}" Grid.Column="1" Grid.Row="0" HorizontalAlignment="Right" VerticalAlignment="Bottom" Background="#BF000000" BorderBrush="Transparent" Foreground="White" Content="..." Width="25" Height="25" Margin="5,0,5,0">
</Button>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
<ListBox.ItemContainerStyle>
<Style TargetType="{x:Type ListBoxItem}">
<Style.Triggers>
<Trigger Property="IsSelected" Value="True">
<Setter Property="Foreground" Value="Yellow" />
<Setter Property="Background" Value="Red"/>
</Trigger>
<Trigger Property="IsSelected" Value="False">
<Setter Property="Foreground" Value="Black" />
<Setter Property="Background" Value="Transparent"/>
</Trigger>
</Style.Triggers>
</Style>
</ListBox.ItemContainerStyle>