带有Rectangle和OpacityMask的{WPF Button}

时间:2016-10-22 00:46:12

标签: c# wpf opacitymask

我想制作一个像Facebook导航栏这样的用户界面。 我的想法是将按钮的背景设置为透明,并在其上放置一个图标作为矩形的OpacityMask并更改它的填充。创作风格我很困惑。

这是代码

for (int i = 0; i < 6; i++)
{
    Button btn = new Button
    {
        Name = ("btnUi" + i).ToString(),
        Width = 42,
        Height = 42,
        Content = new Rectangle
        {
            Fill = Brushes.DarkBlue,
            OpacityMask = new ImageBrush
            {
                ImageSource = new BitmapImage(new Uri(Directory.GetCurrentDirectory() + @"\images\ui_0" + (i + 1).ToString() + ".png"))
            },
            VerticalAlignment = VerticalAlignment.Center,
            Width = 32,
            Height = 32
        },               
        Style = this.FindResource("uiStyle01") as Style
    };
    if (i == 0) btn.IsEnabled = false;
    btn.Click += btnUi_Click;
    uiPanel.Children.Add(btn);
}

和App.xaml

<Application.Resources>
    <Style TargetType="Button" x:Key="uiStyle01">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Button}">
                    <Rectangle x:Name="Rectangle" Fill="MidnightBlue">
                    </Rectangle>

                    <ControlTemplate.Triggers>
                        <Trigger Property="IsEnabled" Value="False">
                            <Setter TargetName="Rectangle" Property="Fill" Value="Gray"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter> 
    </Style> 
</Application.Resources>

我赞美任何想法,以使其更容易。

facebook_sample_image

1 个答案:

答案 0 :(得分:0)

Style中的

“模板”将覆盖您从c#

添加为内容的图像

模板只是向Button添加内容。

简单的解决方案

从xaml中的样式中删除“Template”。

使用以下

public class Main3Activity extends AppCompatActivity {

public Button but5;
public EditText et;
public String hello;
public Integer myNum;
public void main5(){
    et = (EditText) findViewById(R.id.editText);
    hello = et.getText().toString();
    myNum = Integer.parseInt(et.getText().toString());
    but5 = (Button)findViewById(R.id.button5);
    but5.setOnClickListener(new View.OnClickListener() {

        @Override
        public void onClick(View v) {

            if(myNum >= 18){
                Intent a = new Intent(Main3Activity.this,Main5Activity.class);
                startActivity(a);
            } else {
                Intent a = new Intent(Main3Activity.this,Main4Activity.class);
                startActivity(a);
            }


        }
    });
}

这只会更新按钮的背景并保持图像不变。

希望这有帮助。