Telerik Silverlight RadPanelBar階層データテンプレート

Question

以下のレイアウトをtelerik PanelBarで表示する必要があります。 I以下のコードで

各パネルの92％もの以外のすべてを達成することができました。

XAML：私はのItemsSourceを提供xaml.csファイル内

<UserControl.Resources> 
    <DataTemplate x:Key="PanelBarItemTemplate"> 
     <Grid x:Name="grdCategory" ShowGridLines="True"> 
      <Grid.RowDefinitions> 
       <RowDefinition Height="30"></RowDefinition> 
      </Grid.RowDefinitions> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="60*"></ColumnDefinition> 
       <ColumnDefinition Width="40*"></ColumnDefinition> 
      </Grid.ColumnDefinitions> 
      <Grid x:Name="grdSubCategory" Grid.Column="0" Style="{StaticResource CategoryLeftStyle}" > 
       <Grid.RowDefinitions> 
        <RowDefinition Height="20"></RowDefinition> 
       </Grid.RowDefinitions> 
       <Grid.ColumnDefinitions> 
        <ColumnDefinition Width="50*"></ColumnDefinition> 
        <ColumnDefinition Width="25*"></ColumnDefinition> 
        <ColumnDefinition Width="25*"></ColumnDefinition> 
       </Grid.ColumnDefinitions> 
       <TextBlock Text="{Binding CategoryTitle}" Grid.Row="0" Grid.Column="0"/> 
       <HyperlinkButton Grid.Row="0" Grid.Column="1" Style="{StaticResource DetailLinkStyle}" Content="Details" Click="Home_Click"></HyperlinkButton> 
       <TextBlock Text="{Binding Score}" Grid.Row="0" Grid.Column="2"/> 
      </Grid> 
      <TextBlock Text="92%" Grid.Column="1" Grid.Row="0" Grid.RowSpan="2" FontSize="32" FontWeight="Bold"/> 
     </Grid> 
    </DataTemplate> 

    <telerik:HierarchicalDataTemplate x:Key="PanelBarHeaderTemplate" 
           ItemsSource="{Binding SubReports}" 
           ItemTemplate="{StaticResource PanelBarItemTemplate}"> 
     <TextBlock Text="{Binding CategoryTitle}" /> 
    </telerik:HierarchicalDataTemplate> 

</UserControl.Resources> 

<Grid x:Name="LayoutRoot"> 
    <telerik:RadPanelBar x:Name="radPanelBar" 
          ItemTemplate="{StaticResource PanelBarHeaderTemplate}" 
          IsSingleExpandPath="False" > 
    </telerik:RadPanelBar> 
</Grid> 

。

誰かが私を助けることができますか？

Answer 1

これらのコードはすべて、個々のアイテムに対して完全にうまく機能しますが、RadPanelBarのItemContainerStyleも変更する必要があるアイテム（多少サブアイテムの外にある）に対して相対的に92％を配置します。最も簡単な方法は、Blendでそれを抽出し、次にPanelBarItemTopLevelTemplateのItemsContainerという名前のセクションを探します。これはやや粗いバージョンですが、サブアイテムのプロパティの合計を計算するCalcIntというパブリックプロパティを作成して、基本アイテムレベルからバインドできるようにしました。私の修正コードはそうのようになります。

   <Grid x:Name="ItemsContainer" Grid.Row="1" Visibility="Collapsed"> 
       <telerik:LayoutTransformControl x:Name="transformationRoot"> 
        <Grid> 
         <Grid.ColumnDefinitions> 
          <ColumnDefinition /> 
          <ColumnDefinition /> 
         </Grid.ColumnDefinitions> 
         <ItemsPresenter/> 
         <TextBlock Text="{Binding CalcInt}" FontSize="48" Grid.Column="1" HorizontalAlignment="Center" VerticalAlignment="Center" /> 
        </Grid>      
       </telerik:LayoutTransformControl> 
      </Grid> 

私は基本的にはちょうど私の特大のTextBlockを表示するには、いくつかのレイアウトでグリッドにItemsPresenterを含むからそれを変更しました。

コードのサンプルが必要な場合や、他の質問がある場合は、Twitterで私を打つことができます。@EvanHutnick

乾杯！

-Evan

Answer 2

こんにちは、私はあなたがコンバータを定義する必要があると思う：あなたはpercentualを計算することができるようにIValueConverterをし、ラベルに特異的に結合します。 Mario