按钮不显示在网格行内答案

【问题标题】：Button doesn't show inside grid row按钮不显示在网格行内
【发布时间】：2016-04-01 02:01:28
【问题描述】：

我的用户控件看起来很好，有 0 个错误和 0 个警告

但是当我将我的用户控件添加到网格行时，它不会显示我的用户控件中的所有按钮。没有错误甚至警告

<Window
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:UX="clr-namespace:JBoxSystem.UX" x:Class="JBoxSystem.MainWindow"
    Title="MainWindow" Height="700" Width="1100"  Background="#333">
<Window.Resources>
    <Storyboard x:Key="playingEffect"/>
</Window.Resources>
<Window.Triggers>
    <EventTrigger RoutedEvent="FrameworkElement.Loaded">
        <BeginStoryboard Storyboard="{StaticResource playingEffect}"/>
    </EventTrigger>
</Window.Triggers>

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="79*"/>
        <ColumnDefinition Width="429*"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="250*"/>
        <RowDefinition Height="79*"/>
    </Grid.RowDefinitions>
    <WindowsFormsHost Grid.Column="1"/>

    <UX:AlbumSlider Grid.Column="1" Margin="10,0,0,0" Width="Auto" Height="Auto"/>
    <UX:MediaPlayerBar Margin="8,12,6,371" Height="Auto" Width="Auto"/>
    <UX:BottomBar Width="Auto" Height="Auto" Grid.ColumnSpan="2" Grid.Row="1"/>


</Grid>

<UserControl x:Class="JBoxSystem.UX.BottomBar"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         xmlns:local="clr-namespace:JBoxSystem.UX"
         mc:Ignorable="d" 
         d:DesignHeight="250" d:DesignWidth="1020" Background="Transparent">
<UserControl.Resources>
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
            <ResourceDictionary Source="/JBoxSystem;component/Resources/GlassButton.xaml"/>
        </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>
</UserControl.Resources>
<Grid Margin="-15,0,15,0">
    <Button Style="{StaticResource GlassButton}" Background="Blue"  Margin="248,180,717,18">
        <Image Width="47" Height="45" Source="Resources\Images\VolumeUp.png"/>
    </Button>
    <Button Style="{StaticResource GlassButton}" Background="Blue"  Margin="168,180,797,18" Click="Button_Click">
        <Image Width="55" Height="45" Source="Resources\Images\VolumeDown.png"/>
    </Button>
    <Button Style="{StaticResource GlassButton}" Width="45" Height="47" Background="Orange"  Margin="323,183,652,20" Click="Button_Click">
        <Image Width="55" Height="45" Source="Resources\Images\Mute.png"/>
    </Button>

    <Button Style="{DynamicResource SquareGlassButton}" 
        Margin="0,0,890,18" 
        Name="alphabetSearch" 
        Height="72" 
        VerticalAlignment="Bottom" 
        HorizontalAlignment="Right" 
        Width="120">
        <Image Width="72" Height="72" Source="Resources\Images\alphabet_search.png"/>
    </Button>
    <Button Style="{DynamicResource SquareGlassButton}" 
        Margin="0,0,442,-2" 
        Name="alphabetKeyboardSearch" 
        Height="72" 
        VerticalAlignment="Bottom" 
        HorizontalAlignment="Right" 
        Width="120">
        <Image Width="72" Height="72" Source="Resources\Images\keyboard.png"/>
    </Button>
    <Button Style="{StaticResource GlassButton}" Width="40" Height="40" Background="Black"  Margin="413,160,567,50">
        <Image Width="30" Height="30" Source="Resources\images\leftArrow.png" RenderTransformOrigin="0.5,0.5">
            <Image.RenderTransform>
                <TransformGroup>
                    <ScaleTransform/>
                    <SkewTransform/>
                    <RotateTransform Angle="-359.529"/>
                    <TranslateTransform/>
                </TransformGroup>
            </Image.RenderTransform>
        </Image>
    </Button>
    <Button Style="{StaticResource GlassButton}" Width="40" Height="40" Background="Black"  Margin="583,160,397,50">
        <Image Width="30" Height="30" Source="Resources\images\RightArrow.png"/>
    </Button>
    <Button Style="{DynamicResource SquareGlassButton}" 
        Margin="0,0,442,70" 
        Name="numberPadSearch" 
        Height="72" 
        VerticalAlignment="Bottom" 
        HorizontalAlignment="Right" 
        Width="120">
        <Image Width="72" Height="72" Source="Resources\Images\numbers.png"/>
    </Button>
    <Button Style="{DynamicResource SquareGlassButton}" 
        Margin="0,0,250,10" 
        Name="top100Search" 
        Height="72" 
        VerticalAlignment="Bottom" 
        HorizontalAlignment="Right" 
        Width="120">
        <Image Width="64" Height="64" Source="Resources\Images\favorite.png"/>
    </Button>
    <Button Style="{DynamicResource SquareGlassButton}" 
        Margin="0,0,122,10" 
        Name="waitingList" 
        Height="72" 
        VerticalAlignment="Bottom" 
        HorizontalAlignment="Right" 
        Width="120">
        <Image Width="64" Height="64" Source="Resources\Images\waitingList.png"/>
    </Button>
</Grid>

【问题讨论】：

标签： c# wpf xaml button grid-layout

【解决方案1】：

使用 VerticalAlignment="Bottom" HorizontalAlignment="Right" 像这样的 glas 按钮

<Button Style="{StaticResource GlassButton}" Background="Blue"  VerticalAlignment="Bottom" HorizontalAlignment="Right" Margin="248,180,717,18">
        <Image Width="47" Height="45" Source="Resources\Images\VolumeUp.png"/>
    </Button>
    <Button Style="{StaticResource GlassButton}" Background="Blue"  VerticalAlignment="Bottom" HorizontalAlignment="Right"  Margin="168,180,797,18" Click="Button_Click">
        <Image Width="55" Height="45" Source="Resources\Images\VolumeDown.png"/>
    </Button>
    <Button Style="{StaticResource GlassButton}" Width="45" Height="47" Background="Orange"  VerticalAlignment="Bottom" HorizontalAlignment="Right"  Margin="323,183,652,20" Click="Button_Click">
        <Image Width="55" Height="45" Source="Resources\Images\Mute.png"/>
    </Button>

【讨论】：