CODEWITHSUNDEEP
wpfxaml
Sebastian
Sebastian

Reputation: 4811

visibility of 2 buttons with similar style WPF

I use a custom style WPF button with following style [ Purpose is button content (a star image ) is visible on mouseover only)

   <Style x:Key="ViewBookmarkRemoveButtonStyle" TargetType="{x:Type Button}">
            <Style.Resources>
                <Storyboard x:Key="MouseOverAnimation" >
                    <DoubleAnimation Duration="0:0:1" To="1" Storyboard.TargetProperty="Opacity"/>
                </Storyboard>
                <Storyboard x:Key="MouseOutAnimation">
                    <DoubleAnimation Duration="0:0:1" To="0" Storyboard.TargetProperty="Opacity"/>
                </Storyboard>
            </Style.Resources>
            <Setter Property="Opacity" Value="1"></Setter>
            <Setter Property="Margin" Value="0"></Setter>
            <Setter Property="Content">
                <Setter.Value>
                    <Image  Source="images\star_inactive.png" Margin="15" />
                </Setter.Value>
            </Setter>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <Border Background="Transparent" >
                            <ContentPresenter Margin="{TemplateBinding Padding}"  HorizontalAlignment="Center" Content="{TemplateBinding Content}" VerticalAlignment="Center"/>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <Style.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Background" Value="Transparent"/>
                    <Trigger.EnterActions>
                        <BeginStoryboard Storyboard="{StaticResource MouseOverAnimation}" />
                    </Trigger.EnterActions>
                    <Trigger.ExitActions>
                        <BeginStoryboard Storyboard="{StaticResource MouseOutAnimation}" />
                    </Trigger.ExitActions>
                </Trigger>
            </Style.Triggers>
        </Style>

And in page xaml i used 2 instances of the button like this

 <StackPanel>

                <Button Style="{StaticResource ResourceKey=ViewBookmarkAddButtonStyle}"
                                   Name="btnLeft" VerticalAlignment="Top" HorizontalAlignment="Right"                                  
                               ></Button>

                <Button Style="{StaticResource ResourceKey=ViewBookmarkAddButtonStyle}"
                                    Name="btnRight" VerticalAlignment="Top" HorizontalAlignment="Right"                                        
                                    ></Button>
            </StackPanel>

But at run time only one button is visible. Is any such constarints exists or not? Or do i need to create a duplicate copy of one more style to make the second button also follow the same style?

Upvotes: 0

Views: 109

Answers (2)

Sheridan
Sheridan

Reputation: 69985

Your question is somewhat unclear, so please forgive me if I have misunderstood it. I am addressing this part of your question:

Or do i need to create a duplicate copy of one more style to make the second button also follow the same style?

In WPF, you can create a 'duplicate' Style using the Style.BasedOn property like this:

<Style x:Key="AlternativeButtonStyle" TargetType="{x:Type Button}"
    BasedOn="{StaticResource ResourceKey=ViewBookmarkAddButtonStyle}">
    <!-- Declare your different properties or Triggers here -->
</Style>

...

<StackPanel>
    <Button Style="{StaticResource ViewBookmarkAddButtonStyle}" Name="btnLeft"
        VerticalAlignment="Top" HorizontalAlignment="Right" />
    <Button Style="{StaticResource AlternativeButtonStyle}" Name="btnRight" 
        VerticalAlignment="Top" HorizontalAlignment="Right" />
</StackPanel>

Upvotes: 1

Heena
Heena

Reputation: 8654

Set x:Shared="False" to style

X:shared : When set to false, modifies WPF resource-retrieval behavior so that requests for the attributed resource create a new instance for each request instead of sharing the same instance for all requests.

  <Style x:Key="ViewBookmarkRemoveButtonStyle" x:Shared="False"  TargetType="{x:Type Button}">

        ....

  </Style>

Visit this link for x:Shared

Another approach : adding image in ContentPresenter.Content

   <ControlTemplate TargetType="{x:Type Button}">
                    <Border Background="Transparent" >
                        <ContentPresenter Margin="{TemplateBinding Padding}"  HorizontalAlignment="Center"  VerticalAlignment="Center">
                            <ContentPresenter.Content>
                                <Image Source="login.jpg" Margin="2"/>
                            </ContentPresenter.Content>
                        </ContentPresenter>
                    </Border>
    </ControlTemplate>

Upvotes: 1

Related Questions