WPF 中，动态创建Button，并使Button得样式按照自定义的Resource样式显示

2022-07-18 20:03:24

第一步：自定义一个Button的样式

1.新建一个xaml文件，在其中自定义好自己的Resources

这个Resource 的根节点是

2.然后在根节点中写入自己要定义的样式，

注意，在对应特定控件的样式中，要写入 TargetType 对应于要设置样式的控件，如：

TargetType="{x:Type Button}"，并且对样式写上x:key= 以便查找：

入下面一个例子：

                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter TargetName="RefractionLayer" Property="Fill">
                                <Setter.Value>
                                    <RadialGradientBrush GradientOrigin="0.496,1.052">
                                        <RadialGradientBrush.RelativeTransform>
                                            <TransformGroup>
                                                <ScaleTransform
                                          CenterX="0.5"
                                          CenterY="0.5"
                                          ScaleX="1.5"
                                          ScaleY="1.5"/>
                                                <TranslateTransform X="0.02" Y="0.3"/>
                                            </TransformGroup>
                                        </RadialGradientBrush.RelativeTransform>
                                        <GradientStop Offset="1" Color="#00000000"/>
                                        <GradientStop Offset="0.45" Color="#FFFFFFFF"/>
                                    </RadialGradientBrush>
                                </Setter.Value>
                            </Setter>
                            <Setter TargetName="ReflectionLayer" Property="Fill">
                                <Setter.Value>
                                    <RadialGradientBrush GradientOrigin="0.498,0.526">
                                        <RadialGradientBrush.RelativeTransform>
                                            <TransformGroup>
                                                <ScaleTransform
                                          CenterX="0.5"
                                          CenterY="0.5"
                                          ScaleX="1"
                                          ScaleY="1.997"/>
                                                <TranslateTransform X="0" Y="0.5"/>
                                            </TransformGroup>
                                        </RadialGradientBrush.RelativeTransform>
                                        <GradientStop Offset="1" Color="#FFFFFFFF"/>
                                        <GradientStop Offset="0.85" Color="#BBFFFFFF"/>
                                        <GradientStop Offset="0" Color="#00000000"/>
                                    </RadialGradientBrush>
                                </Setter.Value>
                            </Setter>
                        </Trigger>
                        <Trigger Property="IsPressed" Value="True">
                            <Setter TargetName="RefractionLayer" Property="Fill">
                                <Setter.Value>
                                    <RadialGradientBrush GradientOrigin="0.496,1.052">
                                        <RadialGradientBrush.RelativeTransform>
                                            <TransformGroup>
                                                <ScaleTransform
                                          CenterX="0.5"
                                          CenterY="0.5"
                                          ScaleX="1.5"
                                          ScaleY="1.5"/>
                                                <TranslateTransform X="0.02" Y="0.3"/>
                                            </TransformGroup>
                                        </RadialGradientBrush.RelativeTransform>
                                        <GradientStop Offset="1" Color="#00000000"/>
                                        <GradientStop Offset="0.3" Color="#FFFFFFFF"/>
                                    </RadialGradientBrush>
                                </Setter.Value>
                            </Setter>
                            <Setter TargetName="ReflectionLayer" Property="Fill">
                                <Setter.Value>
                                    <RadialGradientBrush GradientOrigin="0.498,0.526">
                                        <RadialGradientBrush.RelativeTransform>
                                            <TransformGroup>
                                                <ScaleTransform
                                          CenterX="0.5"
                                          CenterY="0.5"
                                          ScaleX="1"
                                          ScaleY="1.997"/>
                                                <TranslateTransform X="0" Y="0.5"/>
                                            </TransformGroup>
                                        </RadialGradientBrush.RelativeTransform>
                                        <GradientStop Offset="1" Color="#CCFFFFFF"/>
                                        <GradientStop Offset="0.85" Color="#66FFFFFF"/>
                                        <GradientStop Offset="0" Color="#00000000"/>
                                    </RadialGradientBrush>
                                </Setter.Value>
                            </Setter>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

</ResourceDictionary>

第二步：在项目的配置文件 App.xaml 中配置自定义Resources

在 App.xml根节点下面建立一个 <Application.Resources>，其中定义ResourceDictionary节点

在其中配置自己定义的Resources，例如：

第三步：在页面的后台写程序动态生成Button,

这里的实例是，检索数据库，根据检索的数据动态生成一个按钮，按钮的个数是检索出来的数据的条数

例如：

private void initCourseButton()
       {
           PaperDBHelper.ConnectDB();
           String sql = "select keyID ,courseID,courseName from course order by keyID ";
           DataSet courseDS = PaperDBHelper.GetDataSet(CommandType.Text, sql, null);
           DataTable dt = courseDS.Tables[0];
           for (int i = 0; i < dt.Rows.Count; i++) //for循环检索出来的数据，生成Button
           {
               Button button = new Button();
               button.Content = dt.Rows[i]["courseName"]; //Button按钮上的显示内容为数据库中的一个字段值
               button.Width = 80;
               button.Height = 50;
               button.Margin = new Thickness(0 + i * 80, 507, 560 - i * 120, 4);//动态生成Button的位置
               button.Name = "button" + (i + 1);//动态生成Button的Name
               button.SetResourceReference(StyleProperty, "GlassYButton");//将自定义的样式赋值给Button

//的相应属性，第一个参数是第一步中的Resource是定义的Button的Style，因此第一个参数为StyleProperty

//意思是赋值给style这个属性，第二个参数是样式中的x:key的值
button.Click += new RoutedEventHandler(btnEvent_Click);//为动态生成的Button添加事件
this.ButtonGrid.Children.Add(button);//注意，最后要将自定义的Button控件加入到页面中包含它

//的容器中
this.ButtonGrid.RegisterName("button" + (i + 1), button);//注册button的名称
}

}

WPF 中，动态创建Button，并使Button得样式按照自定义的Resource样式显示

码农公寓

相关文章