CODEWITHSUNDEEP
data-bindingwindows-phone-7listbox
Xstahef
Xstahef

Reputation: 654

Changing color property of Listbox on WP7

I'm beginning with WP7 and I'm trying to change color and other properties of TexBlock. It is included on Listbox and binding to a collection. I am searching for a way like 'OnDataBound'. The value must change depend of the bind object.

<ListBox HorizontalAlignment="Left"  Name="listBox1"  ItemsSource="{Binding}"  >
    <ListBox.ItemTemplate>
        <DataTemplate>
            <Border BorderBrush="{StaticResource PhoneForegroundBrush}" Width="418" BorderThickness="1" Margin="2">
                <StackPanel Orientation="Vertical" >
                    <StackPanel Orientation="Horizontal"><TextBlock Text="Charater: "/><TextBlock Text="{Binding Path=CharacterName}" TextWrapping="Wrap" /></StackPanel>
                    <StackPanel Orientation="Horizontal"><TextBlock Text="Perk launched: "/><TextBlock Text="{Binding Path=CreationDate}" TextWrapping="Wrap"/></StackPanel>
                    <StackPanel Orientation="Horizontal"><TextBlock Text="Finished at: "/><TextBlock Text="{Binding Path=FinishedAt}" TextWrapping="Wrap"/></StackPanel>
                    <StackPanel Orientation="Horizontal"><TextBlock x:Name="TextBlockStatus" Text="Status: "/><TextBlock Text="{Binding Path=Status}" TextWrapping="Wrap"/></StackPanel>
                </StackPanel>
            </Border>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

Depend of Status of binding object, I need change property of Textblock (color, etc.) could you please tell me the stating point ?

My binding is the following (in .cs):

 this.listBox1.DataContext = this.calculatedValues;

thanks for your help

Upvotes: 1

Views: 1041

Answers (1)

Jason James
Jason James

Reputation: 1092

In this example the color if stored in a class called ListItems which is defined as:

public class ListItems
{
    public string name { get; set; }
    public string color { get; set; }
}

An observable colletion of type ListItems is added to the code behind of the MainPage file:

public partial class MainPage : PhoneApplicationPage
{

    ObservableCollection<ListItems> items = new ObservableCollection<ListItems>();
    // Constructor
    public MainPage()
    {
        InitializeComponent();

        items.Add(new ListItems() { name = "Item 1", color = "Red" });
        items.Add(new ListItems() { name = "Item 2", color = "Blue" });
        items.Add(new ListItems() { name = "Item 3", color = "Green" });
        items.Add(new ListItems() { name = "Item 4", color = "White" });
        items.Add(new ListItems() { name = "Item 5", color = "Purple" });

        DataContext = this;
        listBox1.ItemsSource = items;
    }
}

}

And items of type ListItem are added to the observable collection.

The MainPage.xaml file is then designed to contain a list box that has its ItemTemplate bound to the properties of the ListItem class:

    <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
        <ListBox HorizontalAlignment="Left" Margin="12" Width="400" Height="400" Name="listBox1" VerticalAlignment="Top" >
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <TextBlock x:Name="Item" Text="{Binding name}" FontFamily="Arial" FontSize="40" Foreground="{Binding color}" />
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
    </Grid>

The finished page looks like this:

enter image description here

Hope this helps.

Upvotes: 1

Related Questions