WPF:将GRID内容与位图对齐

时间:2011-06-15 20:55:40

标签: wpf bitmap grid textblock

我必须在位图下显示几个字符串。一次可以显示的最大字符串数为5,并不总是显示所有5个字符串。弦的长度也各不相同。无论如何,我想在位图下以视觉上吸引人的方式显示这些字符串。就像,如果只是一个字符串,我想将它集中放在位图下面。如果有两个字符串,我想很好地将字符串空间化并将其置于位图下面等等。 我只知道在运行时要显示的字符串,要显示的字符串数(最小1和最大5)以及字符串的长度。

我编写了下面的XAML代码,但我无法很好地为所有条件定位字符串。 Bitmap1是一个圆圈,bitmap2是左箭头,bitmap3是右箭头。

有人可以帮助我吗?

<Grid x:Name="Graphics" Grid.Column="1" Background="Black">
        <Grid.RowDefinitions>
            <RowDefinition Height="0.319*"/>
            <RowDefinition Height="0.56*"/>
            <RowDefinition Height="0.321*"/>
        </Grid.RowDefinitions>
        <Image Height="72" Source="/DataBinding;component/Bitmap1.bmp" Stretch="Fill" Width="108" Grid.Row="1" />
        <Grid Grid.Row="1">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="0.408*"/>
                <ColumnDefinition Width="0.15*"/>
                <ColumnDefinition Width="0.408*"/>
            </Grid.ColumnDefinitions>
            <Image x:Name="Next" Height="48" Width="48" Grid.Column="2" Source="/DataBinding;component/Bitmap3.bmp"  HorizontalAlignment="Left" />
            <Image x:Name="Prev" Width="48" Height="48" Grid.Column="0" Source="/DataBinding;component/Bitmap2.bmp"  HorizontalAlignment="Right"/>

            <Grid  HorizontalAlignment="Center" ShowGridLines="True" Width="Auto" Grid.ColumnSpan="3" Margin="38,69,41,-40">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                </Grid.ColumnDefinitions>
                <TextBlock Visibility="Visible" Text="String1" Padding="10" Grid.Column="0" FontSize="14.667" TextAlignment="Center" Foreground="White" />
                <TextBlock Visibility="Visible" Text="String2" Padding="10" Grid.Column="1" FontSize="14.667" TextAlignment="Center" Foreground="White" />
                <TextBlock Visibility="Visible" Text="String3" Padding="10" Grid.Column="2" FontSize="14.667" TextAlignment="Center" Foreground="White" />
                <TextBlock Visibility="Visible" Text="String4" Padding="10" Grid.Column="3" FontSize="14.667" TextAlignment="Center" Foreground="White" />
                <TextBlock Visibility="Visible" Text="String5" Padding="10" Grid.Column="4" FontSize="14.667" TextAlignment="Center" Foreground="White" />
            </Grid>
        </Grid>
    </Grid>

2 个答案:

答案 0 :(得分:0)

您要做的是通过基于面板创建自定义控件来创建自定义面板。覆盖ArrangeOverride,然后将内容准确放置在您想要的位置,就像您有一个要使用的画布一样,因为当您重写ArrangeOverride时,面板就像一个画布。网格本身就是一个自定义面板: - )

答案 1 :(得分:0)

                                                                                                                                                                                                                                                                   

            <StackPanel Name="stack1" Orientation="Horizontal" Width="Auto" Background="Red" >
                <TextBlock FontSize="14.667" Width="Auto" TextAlignment="Center">
                                <Run x:Name="String1" Text="String1" />
                                <Run x:Name="String2" Text="String2" />
                <Run x:Name="String3" Text="String3" />
                <Run x:Name="String4" Text="String4" />
                <Run x:Name="String5" Text="String5" />

            </TextBlock>
          </StackPanel>
        </Grid>
    </Grid>