将网格转换为按钮

时间:2011-11-23 09:54:00

标签: silverlight

我有一个2列网格,我想用<Button>包裹现在,当我这样做它完全拧紧网格的布局,如何禁用按钮的样式,以便网格可点击通过按钮但它看起来一样。

当我开始时,我有以下xaml

<Grid>
    <Grid x:Name="LayoutRoot" Background="White">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="180*" />
            <ColumnDefinition Width="296*" />
        </Grid.ColumnDefinitions>

        <Image Grid.Column="0" Source="{Binding image}" Margin="10,10,10,10"/>

        <StackPanel Grid.Column="1">
            <TextBlock Grid.Column="1" Text="{Binding hoursAgo}" FontSize="16" FontWeight="Light" FontStyle="Italic"></TextBlock>
            <TextBlock FontSize="26.667" TextDecorations="Underline" Text="{Binding title}" TextWrapping="Wrap" Height="40" Width="295" HorizontalAlignment="Left" VerticalAlignment="Top" Foreground="#FF3253B8" Canvas.Top="22" Grid.Column="1" >News Title Goes here</TextBlock>
            <TextBlock FontSize="21.333" Text="{Binding description}" TextWrapping="Wrap" d:LayoutOverrides="VerticalAlignment"  Grid.Column="1" />
        </StackPanel>
    </Grid>          
</Grid>

如果我使用表达式混合转换为按钮,它会使源稍微混乱,这不是我想要的

<UserControl.Resources>
    <Style x:Key="SelectedEntry" TargetType="Button">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Button">
                    <Grid>
                        <Grid x:Name="LayoutRoot" Background="White">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="180*" />
                                <ColumnDefinition Width="296*" />
                            </Grid.ColumnDefinitions>

                            <Image Grid.Column="0" Source="{Binding image}" Margin="10,10,10,10"/>

                            <StackPanel Grid.Column="1">
                                <TextBlock FontSize="26.667" TextDecorations="Underline" Text="{Binding title}" TextWrapping="Wrap" Height="40" Width="295" HorizontalAlignment="Left" VerticalAlignment="Top" Foreground="#FF3253B8" Canvas.Top="22" Grid.Column="1" ><Run Text="News Title Goes here"/></TextBlock>
                                <TextBlock FontSize="21.333" Text="{Binding description}" TextWrapping="Wrap" d:LayoutOverrides="VerticalAlignment"  Grid.Column="1" />
                            </StackPanel>
                        </Grid>          
                        <ContentPresenter/>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="FontWeight" Value="Light"/>
        <Setter Property="FontSize" Value="16"/>
        <Setter Property="FontStyle" Value="Italic"/>
    </Style>
</UserControl.Resources>

<Button Content="{Binding hoursAgo}" Style="{StaticResource SelectedEntry}"/>

现在描述没有显示在网格中。

1 个答案:

答案 0 :(得分:0)

打开混合,右键单击要转换为Grid的{​​{1}},然后选择Button

enter image description here

然后在弹出窗口中,选择要转到哪个控件,在您的情况下为Make Into Control。 :)就是这样。

enter image description here