silverlight垂直进度条

时间:2011-03-16 10:24:25

标签: silverlight-4.0 progress-bar rotatetransform

我无法弄清楚我做错了什么。我有一个Usercontrol,它有一个垂直的进度条,下面有一个标签。

<UserControl x:Class="IFramedInBrowser.Code"
    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" Height="150" Width="15">

    <Grid Width="120" Height="15" >
        <StackPanel Width="120" Height="15" >
            <ProgressBar Grid.Row="0" Value="{Binding Path=Percent}"  Maximum="100" Width="120" Height="15" />
        </StackPanel>
        <TextBlock Grid.Row="1" Height="30" HorizontalAlignment="Left"  Name="textBlock1" Text="{Binding Path=Symbol.Name}" VerticalAlignment="Top" >
            <TextBlock.RenderTransform>
                <RotateTransform Angle="90"/>
            </TextBlock.RenderTransform>
        </TextBlock>
        <Grid.RenderTransform>
                <RotateTransform Angle="-90"/>
        </Grid.RenderTransform> 
        </Grid>
</UserControl>

然后在ItemsControl中使用此usercontrol

<ItemsControl x:Name="HorizontalListBox"  
                      ItemsSource="{Binding Source={StaticResource MyViewModel}, Path=List}" 
                      HorizontalAlignment="Stretch" 
                      HorizontalContentAlignment="Center" Height="150" 
                      >
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <StackPanel Orientation="Horizontal"/>
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <my:Code DataContext="{Binding}">

                    </my:Code>
                </DataTemplate>
            </ItemsControl.ItemTemplate>

        </ItemsControl>

最后应该看起来像钢琴键盘...... 旋转变换后,进度条被切断......我做了什么?如何解决这个问题?

2 个答案:

答案 0 :(得分:0)

您可以尝试为所有控件添加不同的背景颜色,以找出控件的大小。

此外,SilverlightSpy现在可以免费使用只读,您可以在运行时浏览真实的可视化树。

无论如何,我建议通过自定义其模板来更改ProgressBar的方向。

答案 1 :(得分:0)

这是剪辑问题。你到处都设置了太多的高度和宽度,知道哪一个控制着尺寸是令人困惑的。此外,ListBox中的堆叠适用于布局,RotateTransform仅在最终的可视化过程中有效,因此它会旋转剪切的进度条。

您应该遵循jumbo的建议并通过修改模板而不是通过轮换来创建垂直进度条。

如果您不想创建模板,则需要删除UserControl中的主网格并使用Canvas。画布不夹。它们让你的元素自由浮动,这可能是你想要的。