none
Button的背景色和popup的关闭问题 RRS feed

  • 问题

  • 最近遇到了两个问题困扰了我很久:

    1、我定义一个Button后使用

    <Button.Background>
     <ImageBrush ImageSource="pic_button1.png"/>
    </Button.Background>

    为按钮添加背景色,但是当鼠标放到按钮上或者鼠标点击按钮是背景色就不显示了。也就是在Hover、IsMoveover时不显示背景色。在WPF中可以使用下面的方法实现:

    <Style x:Key="OkSty" TargetType="{x:Type Image}">
         <Setter Property="Source" Value="OpWndRes\确认1.png"/>
                <Style.Triggers>
                    <Trigger Property="Button.IsMouseOver" Value="true">
                        <Setter Property="Source" Value="OpWndRes\确认2.png"/>
                    </Trigger>
                    <Trigger Property="Button.IsPressed" Value="true">
                        <Setter Property="Source" Value="OpWndRes\确认3.png"/>
                    </Trigger>
                </Style.Triggers>
            </Style>
    

    但在Vs11中却总是提示没有Trigger成员,有什么可以替代的方法吗?

    2、我首先定义了一个UserControl页面SignInControl,然后在BlankPage中使用

    Popup^ m_popup=ref new Popup;
    m_popup = ref new Popup();
    m_popup->Child =ref new SignInControl();
    m_popup->VerticalOffset = 300.0;
    m_popup->HorizontalOffset = 700.0;
    m_popup->IsOpen = true;

    可以在BlankPage中以对话框形式弹出SignInControl页面。现在的问题是我在SignInControl中定义了一个Cancel按钮实现关闭SignInControl页面应该怎么做呢?

    谢谢

    2012年4月25日 6:38

答案

  • 确实错的挺多的, Storyboard 中的对象不对.


    我从Blend中导出了Button的默认模板,给你修改了一下,你看下再按照你的要求自己修改:
        <Page.Resources>
            <Style x:Key="ButtonStyle1" TargetType="Button">
                <Setter Property="Background" Value="{StaticResource ButtonBackgroundBrush}"/>
                <Setter Property="Foreground" Value="{StaticResource ControlForegroundBrush}"/>
                <Setter Property="BorderBrush" Value="{StaticResource ControlNormalStrokeBrush}"/>
                <Setter Property="BorderThickness" Value="{StaticResource ControlBorderThickness}"/>
                <Setter Property="Padding" Value="12,4,12,5"/>
                <Setter Property="HorizontalAlignment" Value="Left"/>
                <Setter Property="VerticalAlignment" Value="Center"/>
                <Setter Property="FontFamily" Value="{StaticResource ContentFontFamily}"/>
                <Setter Property="FontWeight" Value="{StaticResource SemiBold}"/>
                <Setter Property="FontSize" Value="{StaticResource ContentFontSize}"/>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="Button">
                            <Grid>
                                <VisualStateManager.VisualStateGroups>
                                    <VisualStateGroup x:Name="CommonStates">
                                        <VisualState x:Name="Normal"/>
                                        <VisualState x:Name="PointerOver">
                                            <Storyboard>
                                                <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="Border">
                                                    <DiscreteObjectKeyFrame KeyTime="0">
                                                        <DiscreteObjectKeyFrame.Value>
                                                            <ImageBrush ImageSource="Assets/pic_button2.png"/>
                                                        </DiscreteObjectKeyFrame.Value>
                                                    </DiscreteObjectKeyFrame>
                                                </ObjectAnimationUsingKeyFrames>
                                            </Storyboard>
                                        </VisualState>
                                        <VisualState x:Name="Pressed">
                                            <Storyboard>
                                                <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="Border">
                                                    <DiscreteObjectKeyFrame KeyTime="0">
                                                        <DiscreteObjectKeyFrame.Value>
                                                            <ImageBrush ImageSource="Assets/pic_button2.png"/>
                                                        </DiscreteObjectKeyFrame.Value>
                                                    </DiscreteObjectKeyFrame>
                                                </ObjectAnimationUsingKeyFrames>
                                                <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentPresenter">
                                                    <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ControlPressedTextBrush}"/>
                                                </ObjectAnimationUsingKeyFrames>
                                            </Storyboard>
                                        </VisualState>
                                        <VisualState x:Name="Disabled">
                                            <Storyboard>
                                                <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="Border">
                                                    <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ControlDisabledFillBrush}"/>
                                                </ObjectAnimationUsingKeyFrames>
                                                <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="Border">
                                                    <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ControlDisabledBrush}"/>
                                                </ObjectAnimationUsingKeyFrames>
                                                <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentPresenter">
                                                    <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ControlDisabledTextBrush}"/>
                                                </ObjectAnimationUsingKeyFrames>
                                            </Storyboard>
                                        </VisualState>
                                    </VisualStateGroup>
                                    <VisualStateGroup x:Name="FocusStates">
                                        <VisualState x:Name="Focused">
                                            <Storyboard>
                                                <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="FocusVisualWhite"/>
                                                <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="FocusVisualBlack"/>
                                            </Storyboard>
                                        </VisualState>
                                        <VisualState x:Name="Unfocused"/>
                                        <VisualState x:Name="PointerFocused"/>
                                    </VisualStateGroup>
                                </VisualStateManager.VisualStateGroups>
                                <Border x:Name="Border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Margin="3">
                                    <ContentPresenter x:Name="ContentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" ContentTransitions="{TemplateBinding ContentTransitions}" Content="{TemplateBinding Content}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                                </Border>
                                <Rectangle x:Name="FocusVisualWhite" IsHitTestVisible="False" Opacity="0" StrokeDashOffset="1.5" StrokeEndLineCap="Square" Stroke="{StaticResource FocusVisualWhiteStrokeBrush}" StrokeDashArray="1,1"/>
                                <Rectangle x:Name="FocusVisualBlack" IsHitTestVisible="False" Opacity="0" StrokeDashOffset="0.5" StrokeEndLineCap="Square" Stroke="{StaticResource FocusVisualBlackStrokeBrush}" StrokeDashArray="1,1"/>
                            </Grid>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </Page.Resources>
    关于怎么导模板出来,你可以参考我在这个帖子的回复:http://social.msdn.microsoft.com/Forums/zh-CN/metroappzhcn/thread/56f345e9-e8b1-4013-a60e-671aee90e4b0



    Bob Bao [MSFT]
    MSDN Community Support | Feedback to us


    2012年4月26日 10:12
    版主
  • 问题果然可以解决,多谢版主耐心回复。
    • 已标记为答案 Yimin.Xu 2012年4月27日 2:19
    2012年4月27日 2:19

全部回复

  • 1. Metro中是没有触发器,请用VisualState替代。 当MouseOver或者Pressed, 让控件进入不同的VisualState。简单的例子你可以看看文档:http://msdn.microsoft.com/en-us/library/windows/apps/windows.ui.xaml.visualstate

    2. m_popup->IsOpen = false; 即可


    Bob Bao [MSFT]
    MSDN Community Support | Feedback to us

    2012年4月26日 6:07
    版主
  • 多谢版主的回复,第二个问题已经解决。

    针对第一个问题,我加入了:

    <Page.Resources> <Style x:Key="SignInStyle" TargetType="Button"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="Button"> <Grid> <VisualStateManager.VisualStateGroups> <VisualStateGroup x:Name="CommonStates"> <VisualState x:Name="Normal"> <Storyboard> <Button.Background> <ImageBrush ImageSource="Assets/pic_button2.png"/> </Button.Background> </Storyboard> </VisualState>

    <VisualState x:Name="PointerOver"> <Storyboard>

    <Button.Background>
    <ImageBrush   ImageSource="Assets/pic_button2.png"/>
    </Button.Background>

    </Storyboard>

    </VisualState> </VisualStateGroup> </VisualStateManager.VisualStateGroups> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> </Page.Resources>


    来使按钮在正常和鼠标在按钮上都显示背景色,但是上面代码提示有很多错误,版主可以帮我看看应该怎么改么?不胜感激!

    • 已编辑 Yimin.Xu 2012年4月26日 8:04
    2012年4月26日 7:58
  • 确实错的挺多的, Storyboard 中的对象不对.


    我从Blend中导出了Button的默认模板,给你修改了一下,你看下再按照你的要求自己修改:
        <Page.Resources>
            <Style x:Key="ButtonStyle1" TargetType="Button">
                <Setter Property="Background" Value="{StaticResource ButtonBackgroundBrush}"/>
                <Setter Property="Foreground" Value="{StaticResource ControlForegroundBrush}"/>
                <Setter Property="BorderBrush" Value="{StaticResource ControlNormalStrokeBrush}"/>
                <Setter Property="BorderThickness" Value="{StaticResource ControlBorderThickness}"/>
                <Setter Property="Padding" Value="12,4,12,5"/>
                <Setter Property="HorizontalAlignment" Value="Left"/>
                <Setter Property="VerticalAlignment" Value="Center"/>
                <Setter Property="FontFamily" Value="{StaticResource ContentFontFamily}"/>
                <Setter Property="FontWeight" Value="{StaticResource SemiBold}"/>
                <Setter Property="FontSize" Value="{StaticResource ContentFontSize}"/>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="Button">
                            <Grid>
                                <VisualStateManager.VisualStateGroups>
                                    <VisualStateGroup x:Name="CommonStates">
                                        <VisualState x:Name="Normal"/>
                                        <VisualState x:Name="PointerOver">
                                            <Storyboard>
                                                <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="Border">
                                                    <DiscreteObjectKeyFrame KeyTime="0">
                                                        <DiscreteObjectKeyFrame.Value>
                                                            <ImageBrush ImageSource="Assets/pic_button2.png"/>
                                                        </DiscreteObjectKeyFrame.Value>
                                                    </DiscreteObjectKeyFrame>
                                                </ObjectAnimationUsingKeyFrames>
                                            </Storyboard>
                                        </VisualState>
                                        <VisualState x:Name="Pressed">
                                            <Storyboard>
                                                <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="Border">
                                                    <DiscreteObjectKeyFrame KeyTime="0">
                                                        <DiscreteObjectKeyFrame.Value>
                                                            <ImageBrush ImageSource="Assets/pic_button2.png"/>
                                                        </DiscreteObjectKeyFrame.Value>
                                                    </DiscreteObjectKeyFrame>
                                                </ObjectAnimationUsingKeyFrames>
                                                <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentPresenter">
                                                    <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ControlPressedTextBrush}"/>
                                                </ObjectAnimationUsingKeyFrames>
                                            </Storyboard>
                                        </VisualState>
                                        <VisualState x:Name="Disabled">
                                            <Storyboard>
                                                <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="Border">
                                                    <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ControlDisabledFillBrush}"/>
                                                </ObjectAnimationUsingKeyFrames>
                                                <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="Border">
                                                    <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ControlDisabledBrush}"/>
                                                </ObjectAnimationUsingKeyFrames>
                                                <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentPresenter">
                                                    <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ControlDisabledTextBrush}"/>
                                                </ObjectAnimationUsingKeyFrames>
                                            </Storyboard>
                                        </VisualState>
                                    </VisualStateGroup>
                                    <VisualStateGroup x:Name="FocusStates">
                                        <VisualState x:Name="Focused">
                                            <Storyboard>
                                                <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="FocusVisualWhite"/>
                                                <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="FocusVisualBlack"/>
                                            </Storyboard>
                                        </VisualState>
                                        <VisualState x:Name="Unfocused"/>
                                        <VisualState x:Name="PointerFocused"/>
                                    </VisualStateGroup>
                                </VisualStateManager.VisualStateGroups>
                                <Border x:Name="Border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Margin="3">
                                    <ContentPresenter x:Name="ContentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" ContentTransitions="{TemplateBinding ContentTransitions}" Content="{TemplateBinding Content}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                                </Border>
                                <Rectangle x:Name="FocusVisualWhite" IsHitTestVisible="False" Opacity="0" StrokeDashOffset="1.5" StrokeEndLineCap="Square" Stroke="{StaticResource FocusVisualWhiteStrokeBrush}" StrokeDashArray="1,1"/>
                                <Rectangle x:Name="FocusVisualBlack" IsHitTestVisible="False" Opacity="0" StrokeDashOffset="0.5" StrokeEndLineCap="Square" Stroke="{StaticResource FocusVisualBlackStrokeBrush}" StrokeDashArray="1,1"/>
                            </Grid>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </Page.Resources>
    关于怎么导模板出来,你可以参考我在这个帖子的回复:http://social.msdn.microsoft.com/Forums/zh-CN/metroappzhcn/thread/56f345e9-e8b1-4013-a60e-671aee90e4b0



    Bob Bao [MSFT]
    MSDN Community Support | Feedback to us


    2012年4月26日 10:12
    版主
  • 问题果然可以解决,多谢版主耐心回复。
    • 已标记为答案 Yimin.Xu 2012年4月27日 2:19
    2012年4月27日 2:19