0

使用 Silverlight 3,我正在尝试重新创建类对象可视化,如 Visual Studio 的类图中所示。但是,我的对象将代表数据库对象而不是类定义。如以下两张图片所示,我已经部分成功。

替代文字 http://img41.imageshack.us/img41/5669/tablestructurenotexpandb.png http://img41.imageshack.us/img41/7634/tablestructurenotexpand.png

这两个都是以固定大小创建的,因此它们不会根据内容自动调整大小,这是正确的。

但是,我希望能够分别根据控件中的行数和列数自动调整控件的高度和宽度。我希望能够以完全声明的方式做到这一点。此外,即使我更改字体,我也希望它能够正确自动调整大小。

然而,我不确定我将如何去做。我不确定我是否使用或多或少适合自动调整大小的控件。任何帮助将非常感激。

这是创建此控件的 XAML。

<UserControl x:Class="SchemaDesigner.TableBox2"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400">

    <Border BorderThickness="1" BorderBrush="#FF716F6E" CornerRadius="10" Width="252" Height="202">  <!-- Height="202"-->
        <Canvas>
            <Canvas.Clip>
                <RectangleGeometry RadiusX="10" RadiusY="10" Rect="0,0,250,200"/>
            </Canvas.Clip>
            <StackPanel Width="250"  Background="White">
                <StackPanel Width="250" Height="45" Orientation="Vertical">
                    <StackPanel.Background>
                        <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
                            <GradientStop Color="#FFD3DCEF"  Offset="0.0" />
                            <GradientStop Color="#FFFFFFFF" Offset=" 1.0"/>
                        </LinearGradientBrush>
                    </StackPanel.Background>
                    <StackPanel Width="250" Orientation="Horizontal">
                        <StackPanel Width="210" Height="45" Orientation="Vertical">
                            <TextBlock Text="{Binding Name}" Width="190" HorizontalAlignment="Left" FontFamily="Verdana" Margin="10,10,0,0" VerticalAlignment="Top" FontWeight="Black" FontSize="12"/>
                            <TextBlock Text="{Binding Type}" Width="190" HorizontalAlignment="Left" FontFamily="Verdana" Margin="10,0,0,0" VerticalAlignment="Top" FontStyle="Italic"/>
                        </StackPanel>
                        <Button Width="20" Height="20" VerticalAlignment="Top" Margin="10" Content="^" FontFamily="Verdana" />
                    </StackPanel>
                </StackPanel>

                <ItemsControl x:Name="items" ItemsSource="{Binding Rows}">
                    <ItemsControl.ItemTemplate>
                        <DataTemplate>
                                <StackPanel Width="250" Orientation="Horizontal">
                                    <Image Width="16" Height="16" VerticalAlignment="Center" Source="/SchemaDesigner;component/column.png"/>
                                    <TextBlock Text="{Binding ColumnName}" Width="100" Height="20"/>
                                    <TextBlock Text="{Binding ColumnType}" Width="130" Height="20"/>
                                </StackPanel>
                        </DataTemplate>
                    </ItemsControl.ItemTemplate>
                </ItemsControl>

            </StackPanel>
        </Canvas>
    </Border>

</UserControl>
4

1 回答 1

1

我浏览了代码,有很多地方明确设置了高度,这会干扰布局计算。

所做的更改如下:

  • 用户控件有一个明确的高度/宽度,我已将其删除。
  • 添加画布只是为了提供剪辑功能,并且没有必要(更不用说画布没有指定大小会导致问题)
  • 水平和垂直对齐设置专门设置为居中以避免它拉伸内容以适应屏幕,它将适合内容。
  • 为顶部背景提供剪裁以避免覆盖边框的矩形已设置为背景的高度 +10(半径),因此背景的底部也不会被剪裁为曲线(并且 10 将其保持在合理的高度。)
  • 我在项目控件中取出了高度,这不是必需的,但我更喜欢内容询问他们需要的高度,而不是给定一个任意高度。/edit :如果您希望它根据字体大小进行更改,这将成为必要,您不能显式设置高度,并且还希望它同时自动调整高度/edit。

创建了一个具有正确属性/子集合并绑定到它的虚拟本地类,结果看起来像我认为你想要的。如果您希望蓝色背景的底部也弯曲,则堆栈面板剪辑的高度应设置为 45。

不要忘记重命名课程,我的版本只是 mainpage1。

希望有帮助

一个。

    <UserControl x:Class="SilverlightApplication1.MainPage"
                xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"    
                 xmlns:d="http://schemas.microsoft.com/expression/blend/2008"    
                 xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"    
                 mc:Ignorable="d">

    <Border BorderThickness="1" BorderBrush="#FF716F6E" CornerRadius="10" VerticalAlignment="Center" HorizontalAlignment="Center">
        <StackPanel Width="250" Orientation="Vertical" VerticalAlignment="Center">
             <StackPanel Width="250" Height="45" Orientation="Vertical" >
                <StackPanel.Clip>
                   <RectangleGeometry RadiusX="10" RadiusY="10" Rect="0,0,250,55"/> 
                </StackPanel.Clip>
                    <StackPanel.Background>
                    <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
                        <GradientStop Color="#FFD3DCEF"  Offset="0.0" />
                        <GradientStop Color="#FFFFFFFF" Offset=" 1.0"/>
                    </LinearGradientBrush>
                </StackPanel.Background>
                <StackPanel Width="250" Orientation="Horizontal">
                    <StackPanel Width="210" Height="45" Orientation="Vertical">
                        <TextBlock Text="{Binding Name}" Width="190" HorizontalAlignment="Left" FontFamily="Verdana" Margin="10,10,0,0" VerticalAlignment="Top" FontWeight="Black" FontSize="12"/>
                        <TextBlock Text="{Binding Type}" Width="190" HorizontalAlignment="Left" FontFamily="Verdana" Margin="10,0,0,0" VerticalAlignment="Top" FontStyle="Italic"/>
                    </StackPanel>
                    <Button Width="20" Height="20" VerticalAlignment="Top" Margin="10" Content="^" FontFamily="Verdana" />
                </StackPanel>
            </StackPanel>
            <ItemsControl x:Name="items" ItemsSource="{Binding Rows}">
                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                        <StackPanel Width="250" Orientation="Horizontal">
                            <Image Width="16" Height="16" VerticalAlignment="Center" Source="/SchemaDesigner;component/column.png"/>
                            <TextBlock Text="{Binding ColumnName}" Width="100" />
                            <TextBlock Text="{Binding ColumnType}" Width="130" />
                        </StackPanel>
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
            </ItemsControl>
        </StackPanel>
    </Border>
</UserControl>
于 2009-06-29T15:49:47.867 回答