CODEWITHSUNDEEP
c#wpfxaml
Corey James Carney
Corey James Carney

Reputation: 167

XAML, Secondary Button isn't showing

so I'm trying to use 2 buttons in the same spot using xaml, one is going to be a play button and the other a pause button, but for some reason, not entirely sure as to why just yet, but only the first button in XAML will show, and if i set this given button to hidden the secondary button never gets rendered.

any ideas?

Here's the code.

<DataGridTemplateColumn Width="100">
    <DataGridTemplateColumn.CellTemplate>
        <DataTemplate>
            <DockPanel Width="50" Height="50" VerticalAlignment="Center" HorizontalAlignment="Center">
                <Button Style="{DynamicResource MetroCircleButtonStyle}" Visibility="Hidden" Name="PlayButton"
                                            Width="50" Height="50" HorizontalAlignment="Center"
                                            VerticalAlignment="Center" Click="OnPlayButtonClicked"
                                            d:DataContext="{d:DesignInstance local:MainWindow}">
                    <Rectangle Width="20"
                                                   Height="20">
                        <!--<Image Width="50" Height="50" Source="Resources/playIcon.png"  Name="Image"></Image>-->
                        <Rectangle.Fill>
                            <VisualBrush Stretch="Fill"
                                                             Visual="{StaticResource appbar_control_play}" />
                        </Rectangle.Fill>
                    </Rectangle>
                    <!--<Image Width="50" Height="50" Source="Resources/playIcon.png"  Name="Image"></Image>-->
                </Button>

                <Button Style="{DynamicResource MetroCircleButtonStyle}" Visibility="Visible" Name="PauseButton"
                                            Width="50" Height="50" HorizontalAlignment="Center"
                                            VerticalAlignment="Center" Click="OnPauseButtonClicked"
                                            d:DataContext="{d:DesignInstance local:MainWindow}">
                    <Rectangle Width="20"
                                                   Height="20">
                        <!--<Image Width="50" Height="50" Source="Resources/playIcon.png"  Name="Image"></Image>-->
                        <Rectangle.Fill>
                            <VisualBrush Stretch="Fill"
                                                             Visual="{StaticResource appbar_control_pause}" />
                        </Rectangle.Fill>
                    </Rectangle>
                    <!--<Image Width="50" Height="50" Source="Resources/playIcon.png"  Name="Image"></Image>-->
                </Button>
            </DockPanel>
        </DataTemplate>
    </DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>

Upvotes: 1

Views: 73

Answers (1)

mm8
mm8

Reputation: 169200

Use a Grid instead of a DockPanel:

<Grid Width="50" Height="50" VerticalAlignment="Center" HorizontalAlignment="Center">
    <Button Style="{DynamicResource MetroCircleButtonStyle}" Visibility="Hidden" Name="PlayButton"
                                            Width="50" Height="50" HorizontalAlignment="Center"
                                            VerticalAlignment="Center" Click="OnPlayButtonClicked"
                                            d:DataContext="{d:DesignInstance local:MainWindow}">
        <Rectangle Width="20"
                                                   Height="20">
            <!--<Image Width="50" Height="50" Source="Resources/playIcon.png"  Name="Image"></Image>-->
            <Rectangle.Fill>
                <VisualBrush Stretch="Fill"
                                                             Visual="{StaticResource appbar_control_play}" />
            </Rectangle.Fill>
        </Rectangle>
        <!--<Image Width="50" Height="50" Source="Resources/playIcon.png"  Name="Image"></Image>-->
    </Button>

    <Button Style="{DynamicResource MetroCircleButtonStyle}" Visibility="Visible" Name="PauseButton"
                                            Width="50" Height="50" HorizontalAlignment="Center"
                                            VerticalAlignment="Center" Click="OnPauseButtonClicked"
                                            d:DataContext="{d:DesignInstance local:MainWindow}">
        <Rectangle Width="20"
                                                   Height="20">
            <!--<Image Width="50" Height="50" Source="Resources/playIcon.png"  Name="Image"></Image>-->
            <Rectangle.Fill>
                <VisualBrush Stretch="Fill"
                                                             Visual="{StaticResource appbar_control_pause}" />
            </Rectangle.Fill>
        </Rectangle>
        <!--<Image Width="50" Height="50" Source="Resources/playIcon.png"  Name="Image"></Image>-->
    </Button>
</Grid>

Upvotes: 1

Related Questions