SyleProblem:无法更改特定按钮的BackGround吗? [英] SyleProblem: Can't Change BackGround Of Particular button ?

查看:91
本文介绍了SyleProblem:无法更改特定按钮的BackGround吗?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

1.我有一个==> UserControl.
2.在该UserControl ==>中一个ItemsControl.
现在ItemsControl根据给定的ItemsSource 生成Button’s.
我为这些按钮提供了一些样式.
==> Pages.xaml中的按钮.
==> DataPagerResourceDictionary.xaml中的样式和样式.
我在Maindwindow.xaml中使用了UserControl.
但我无法根据按钮的内容更改特定按钮Background.

您可以从此处
下载完整代码.
如果我不为按钮提供样式,则下面的代码可以正常工作.
[仅当我为按钮提供样式时才出现问题,请看下面的代码片段]

1. I have one ==> UserControl.
2. Inside that UserControl ==> One ItemsControl.
Now ItemsControl generating Button’s As per ItemsSource given to it.
I have given some style for those buttons .
==> Button''s inside Pages.xaml.
==> and Style inside DataPagerResourceDictionary.xaml.
I have using UserControl inside my Maindwindow.xaml.
but i can''t change Background of Particular Button based on Content Of Button.

You can download Complete Code from Here

This below code works fine if I do not provide style to button.
[the problem only arise if i provide style to button, have a look at below code snippets]

for (int i = 0; i < displayPages.pageControl.Items.Count; i++)
          {
              var container = displayPages.pageControl.ItemContainerGenerator.ContainerFromIndex(i) as ContentPresenter;
              var button = container.ContentTemplate.FindName("pageNumberButton", container) as Button;
              if (button.Content == "  3  ")
              {
                  button.Background = Brushes.Red;
              }
          }


我在下面的代码片段中提供了 style to button
[外观insdie Pages.xaml ].


I have Provided style to button inside following Code snippet
[Have look insdie Pages.xaml].

........
<ItemsControl.ItemTemplate>
                  <DataTemplate>
                      <Button x:Name="pageNumberButton"  Style="{StaticResource TransparentButton}"   Content="{Binding Path=Page_Number}"></Button>
                  </DataTemplate>
              </ItemsControl.ItemTemplate>
........



您可以下载代码或查看以下代码:

MainWindow.xaml



you can download Code or Have Look At Below Code:

MainWindow.xaml

<Window x:Class="StylingProblem.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"

           xmlns:Local="clr-namespace:StylingProblem">
       <Grid>
           <Local:Pages x:Name="displayPages"></Local:Pages>
           <Button Content="Change Color Button" Height="23" HorizontalAlignment="Left" Margin="149,164,0,0" Name="button1" VerticalAlignment="Top" Width="133" Click="button1_Click" />
       </Grid>
   </Window>



MainWindow.xaml.cs



MainWindow.xaml.cs

public partial class MainWindow : Window
        {
            ObservableCollection<PageNumber> pageCollection = new ObservableCollection<PageNumber>();
    
            public MainWindow()
            {
                InitializeComponent();
                pageCollection.Add(new PageNumber("  1  "));
                pageCollection.Add(new PageNumber("  2  "));
                pageCollection.Add(new PageNumber("  3  "));
                pageCollection.Add(new PageNumber("  4  "));
                pageCollection.Add(new PageNumber("  5  "));
                pageCollection.Add(new PageNumber("  6  "));
    
                this.DataContext = this;
            }
    
            public ObservableCollection<PageNumber> PageCollection
            {
                get
                {
                    return this.pageCollection;
                }
                set
                {
                    this.pageCollection = value;
                }
            }
    
            private void button1_Click(object sender, RoutedEventArgs e)
            {
                //Chage Color of Perticular button here
                //Suppose say change the color of button with content == "  3  "
    
                #region --  THIS CODE WORKS FINE IF I DON''T PROVIDE ANY STYLE TO BUTTON [see Pages.xaml]  --
                for (int i = 0; i < displayPages.pageControl.Items.Count; i++)
                {
                    var container = displayPages.pageControl.ItemContainerGenerator.ContainerFromIndex(i) as ContentPresenter;
                    var button = container.ContentTemplate.FindName("pageNumberButton", container) as Button;
                    if (button.Content == "  3  ")
                    {
                        button.Background = Brushes.Red;
                    }
                } 
                #endregion
    
               
            }



Pages.xaml [用户控制]



Pages.xaml [USER CONTROL]

<UserControl x:Class="StylingProblem.Pages"

                xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

                xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

                xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

                xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

                mc:Ignorable="d"

                 >
       <UserControl.Resources>
           <ResourceDictionary Source="DataPagerResourceDictionary.xaml"/>
       </UserControl.Resources>
       <Grid>
           <ItemsControl Name="pageControl" ItemsSource="{Binding Path=PageCollection}">
               <ItemsControl.Template>
                   <ControlTemplate TargetType="ItemsControl">
                       <Border >
                           <StackPanel>
                               <ItemsPresenter></ItemsPresenter>
                           </StackPanel>
                       </Border>
                   </ControlTemplate>
               </ItemsControl.Template>
               <ItemsControl.ItemsPanel x:Uid="pageItemTemplate">
                   <ItemsPanelTemplate>
                       <StackPanel Orientation="Horizontal"/>
                   </ItemsPanelTemplate>
               </ItemsControl.ItemsPanel>
               <ItemsControl.ItemTemplate>
                   <DataTemplate>
                       <Button x:Name="pageNumberButton" Style="{StaticResource TransparentButton}"  Content="{Binding Path=Page_Number}"></Button>
                   </DataTemplate>
               </ItemsControl.ItemTemplate>

           </ItemsControl>
       </Grid>
   </UserControl>


按钮样式:DataPagerResourceDictionary.xaml


STYLE OF BUTTON: DataPagerResourceDictionary.xaml

<ResourceDictionary

      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

       >
        <Style TargetType="Button" x:Key="TransparentButton">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Border  CornerRadius="2,2,2,2"  HorizontalAlignment="Center" x:Name="borderTemplate" Background="Transparent">
                            <ContentPresenter/>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="true">
                                <Setter TargetName="borderTemplate"  Property="Border.BorderBrush" Value="Gray" />
                                <Setter TargetName="borderTemplate"  Property="Border.BorderThickness" Value="1" />
                            </Trigger>
                            <Trigger Property="IsPressed" Value="true">
                                <Setter TargetName="borderTemplate"  Property="Border.BorderBrush" Value="Lime" />
                            </Trigger>
                            <Trigger Property="IsFocused" Value="true">
                                <Setter TargetName="borderTemplate"  Property="Border.Background" Value="#FD7" />
                            </Trigger>
                            <Trigger Property="IsEnabled" Value="false">
                                <Setter TargetName="borderTemplate"  Property="Border.Background" Value="LightGray"></Setter>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </ResourceDictionary>



谢谢.........



Thanks.........

推荐答案

您不能更改背景,因为您的控件模板不尊重background属性.您无需在模板中设置Background ="Transparent",而是需要使用TemplateBinding绑定到按钮的实际Background属性.

*编辑*
啊,好眼睛-我错过了问题.也许这...
You can''t change the background because your control template doesn''t respect the background property. Instead of setting Background = "Transparent" in your template, you need to use TemplateBinding to bind to the actual Background property of the button.

*Edit*
Ah, good eye - I missed the problem. Maybe this...
<Style TargetType="Button" x:Key="TransparentButton">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Border  CornerRadius="2,2,2,2"  HorizontalAlignment="Center" x:Name="borderTemplate" Background="{TemplateBinding Background}">
                    <ContentPresenter/>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="true">
                        <Setter TargetName="borderTemplate"  Property="Border.BorderBrush" Value="Gray" />
                        <Setter TargetName="borderTemplate"  Property="Border.BorderThickness" Value="1" />
                    </Trigger>
                    <Trigger Property="IsPressed" Value="true">
                        <Setter TargetName="borderTemplate"  Property="Border.BorderBrush" Value="Lime" />
                    </Trigger>
                    <Trigger Property="IsFocused" Value="true">
                        <Setter TargetName="borderTemplate"  Property="Border.Background" Value="#FD7" />
                    </Trigger>
                    <Trigger Property="IsEnabled" Value="false">
                        <Setter TargetName="borderTemplate"  Property="Border.Background" Value="LightGray"></Setter>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Setter Property="Background" Value="Transparent" />
</Style>


这篇关于SyleProblem:无法更改特定按钮的BackGround吗?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆