zoukankan      html  css  js  c++  java
  • WP7中对ListBox的ItemTemplate中子元素的后台操作

    为了使自己开发的软件更加适应Windows Phone 7所提供的两套黑白主题,我们需要对主题进行判断,然后做出不同的控件外观显示效果。比如要完成一个好友列表显示,在列表的每个listbox item中的背景需要根据用户当前所选择的主题来分别显示不同的颜色,先看看前台的代码:
    复制代码
    <ListBox x:Name="FirstListBox" ItemsSource="{Binding mFriends}" Margin="0,-6,-12,0" Height="541">
    <ListBox.ItemTemplate>
    <DataTemplate>
    <Border x:Name="borderListBox" Margin="5" CornerRadius="3">
    <StackPanel Orientation="Horizontal">
    <Image Height="80" Margin="20" Width="80" Source="{Binding Image_Url}">
    </Image>
    <StackPanel>
    <StackPanel Orientation="Horizontal">
    <TextBlock Margin="0,10,0,0" Text="{Binding Name}" FontFamily="/Fonts/YGY20070701.ttf#叶根友钢笔行书简体" Foreground="{StaticResource UseNameUnSelectedBrush}" TextWrapping="Wrap" FontSize="28"/>
    <Image Name="VipImage" Source="{Binding Vip}" Width="32" Height="32"></Image>
    </StackPanel>
    <TextBlock Width="328" Text="{Binding message}" Foreground="Black" TextWrapping="Wrap" />
    </StackPanel>
    </StackPanel>
    </Border>
    </DataTemplate>
    </ListBox.ItemTemplate>
    </ListBox>
    复制代码
    那么如何获取ListBox中的StackPanel这个子元素的值呢,又如何来对每个Item的背景色进行改变呢?我们可以用下面的方法来进行判断,首先获取当前系统所使用的背景色,然后遍历ListBox中的每个item,利用泛型函数对该ListBox的整个visual tree进行读取,根据需要选择StackPanel类型的控件(这里读者可以根据实际情况做改动。)
    方法一:
    复制代码
    var back = Application.Current.Resources["PhoneBackgroundColor"].ToString();
    if (back == "#FF000000")
    {
    for (int i = 0; i < FirstListBox.Items.Count; i++)
    {
    ListBoxItem item
    = this.FirstListBox.ItemContainerGenerator.ContainerFromIndex(i) as ListBoxItem;
    StackPanel border
    = FindFirstElementInVisualTree<StackPanel>(item);
    border.Background
    = new SolidColorBrush(Color.FromArgb(170, 255, 255, 255));
    }
    }
    else
    {
    for (int i = 0; i < FirstListBox.Items.Count; i++)
    {
    ListBoxItem item
    = this.FirstListBox.ItemContainerGenerator.ContainerFromIndex(i) as ListBoxItem;
    StackPanel border
    = FindFirstElementInVisualTree<StackPanel>(item);
    border.Background
    = new SolidColorBrush(Color.FromArgb(255, 34, 34, 34));
    }

    }
    private T FindFirstElementInVisualTree<T>(DependencyObject parentElement) where T : DependencyObject
    {
         var count = VisualTreeHelper.GetChildrenCount(parentElement);
         if (count == 0)
            return null;
         for (int i = 0; i < count; i++)
         {
            var child = VisualTreeHelper.GetChild(parentElement, i);
          if (child != null && child is T)
        {
           return (T)child;
       }
            else
            {
               var result = FindFirstElementInVisualTree<T>(child);
           if (result != null)
                  return result;
            }
         }
         return null;
    }
    复制代码
    好了看看效果吧(只是个示例,更炫的效果还需要读者自己斟酌了呵呵)PS:背景我采用了两张图片。
    方法二:
    还有个方法来进行操作,可以看下面方法,方法是参照WindowsPhoneGeek网站上的,大家也可以看看。
    复制代码
    private void SearchVisualTree(DependencyObject targetElement)
    {
    var count
    = VisualTreeHelper.GetChildrenCount(targetElement);
    if (count == 0)
    return; for (int i = 0; i < count; i++)
    {
    var child
    = VisualTreeHelper.GetChild(targetElement, i);
    if (child is StackPanel)
    {
    StackPanel targetItem
    = (StackPanel)child;
    var back
    = Application.Current.Resources["PhoneBackgroundColor"].ToString();
    if (back == "#FF000000")
    {
    targetItem.Background
    = new SolidColorBrush(Color.FromArgb(255, 34, 34, 34));
    }
    else
    {
    targetItem.Background
    = new SolidColorBrush(Color.FromArgb(170, 255, 255, 255));
    }

    }
    else
    {
    SearchVisualTree(child);
    }
    }
    }
    复制代码
    调用的时候只需要用下面这个函数就可以了,看起来比第一个方法更简单:
    this.SearchVisualTree(this.FirstListBox);
  • 相关阅读:
    是什么原因导致了以下错误:javascript中的“string.split不是一个函数”?
    ajax获取后台返回的数据中午乱码是怎么回事
    [Javascript] Create an Async Generator and Loop Through Generated Promises with "For Await Of" Loops
    [Ramda] Lens in Depth
    [Javascript] Multiply Two Arrays over a Function in JavaScript
    [Cypress] install, configure, and script Cypress for JavaScript web applications -- part3
    [Cypress] install, configure, and script Cypress for JavaScript web applications -- part2
    [Cypress] install, configure, and script Cypress for JavaScript web applications -- part1
    [Testing] JavaScript Mocking Fundamentals
    [CSS] Useful CSS tool for Web designer and developer
  • 原文地址:https://www.cnblogs.com/zziss/p/2792044.html
Copyright © 2011-2022 走看看