2012-01-28 58 views
1

我需要在用户做出选择后减少列表选择器在手机屏幕上占用的空间量。我可以减少选定的项目的宽度,但我还没有找到一种方法来减少高度。是的,我可以减小控件的大小,但标题总是占用35个单位,而选定项目所采用的面板高度为70.减小列表选择器的高度使其看起来更小,但这只会使底部所选项目显示的面板。文本仍居中。设置VerticalContentAlignment不起作用,所以随着高度的降低,文字会逐渐变得模糊。有没有办法降低所选项目显示的面板的高度 - 或将所选文本的对齐方式移动到面板的顶部,然后清空未显示任何文本的底部部分?如何在Windows Phone中设置Silverlight ListPicker中选定项目的高度

回答

1

这一点是可以通过在Expression Blend中的模板轻松完成 -

  1. 在Expression Blend中打开项目。
  2. 使用ListPicker导航到您的页面。
  3. 在对象和时间线框中,找到您的ListPicker。
  4. 右击,选择编辑模板 - >编辑一个副本 - >输入一个名称来使用选择定义在 - >应用程序,然后点击确定。
  5. 单击对象和时间线框中的网格。在属性框中,输入一个新的高度。我用36.
  6. 展开边框
  7. 单击UserControl。
  8. 在属性窗口,更改从19磅的字体大小设置为小尺寸(12磅)
  9. 现在,您创建的模板,你需要将它应用到所有listpickers像这样:
<toolkit:ListPicker Style="{StaticResource ListPickerStyle1}"/> 

这里的来源。

<Style x:Key="ListPickerStyle1" TargetType="toolkit:ListPicker"> 
       <Setter Property="Background" Value="{StaticResource PhoneTextBoxBrush}"/> 
       <Setter Property="Foreground" Value="{StaticResource PhoneTextBoxForegroundBrush}"/> 
       <Setter Property="BorderBrush" Value="{StaticResource PhoneTextBoxBrush}"/> 
       <Setter Property="BorderThickness" Value="{StaticResource PhoneBorderThickness}"/> 
       <Setter Property="FontSize" Value="{StaticResource PhoneFontSizeMediumLarge}"/> 
       <Setter Property="HorizontalContentAlignment" Value="Left"/> 
       <Setter Property="Margin" Value="{StaticResource PhoneTouchTargetOverhang}"/> 
       <Setter Property="PickerPageUri" Value="/Microsoft.Phone.Controls.Toolkit;component/ListPicker/ListPickerPage.xaml"/> 
       <Setter Property="Template"> 
        <Setter.Value> 
         <ControlTemplate TargetType="toolkit:ListPicker"> 
          <StackPanel> 
           <VisualStateManager.VisualStateGroups> 
            <VisualStateGroup x:Name="PickerStates"> 
             <VisualState x:Name="Normal"/> 
             <VisualState x:Name="Highlighted"> 
              <Storyboard> 
               <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetProperty="Background" Storyboard.TargetName="Border"> 
                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneTextBoxEditBackgroundColor}"/> 
               </ObjectAnimationUsingKeyFrames> 
               <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="Border"> 
                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneTextBoxEditBorderBrush}"/> 
               </ObjectAnimationUsingKeyFrames> 
              </Storyboard> 
             </VisualState> 
             <VisualState x:Name="Disabled"> 
              <Storyboard> 
               <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetProperty="Background" Storyboard.TargetName="Border"> 
                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource TransparentBrush}"/> 
               </ObjectAnimationUsingKeyFrames> 
               <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="Border"> 
                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}"/> 
               </ObjectAnimationUsingKeyFrames> 
               <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetProperty="Foreground" Storyboard.TargetName="UserControl"> 
                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}"/> 
               </ObjectAnimationUsingKeyFrames> 
              </Storyboard> 
             </VisualState> 
            </VisualStateGroup> 
           </VisualStateManager.VisualStateGroups> 
           <ContentControl ContentTemplate="{TemplateBinding HeaderTemplate}" Content="{TemplateBinding Header}" Foreground="{StaticResource PhoneSubtleBrush}" FontSize="{StaticResource PhoneFontSizeNormal}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="0 0 0 8"/> 
           <Grid Height="36"> 
            <Border x:Name="Border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}"> 
             <UserControl x:Name="UserControl" Foreground="{TemplateBinding Foreground}" FontSize="16"> 
              <StackPanel> 
               <TextBlock x:Name="MultipleSelectionModeSummary" Margin="8 8 0 8"/> 
               <Canvas x:Name="ItemsPresenterHost" MinHeight="46"> 
                <ItemsPresenter x:Name="ItemsPresenter"> 
                 <ItemsPresenter.RenderTransform> 
                  <TranslateTransform x:Name="ItemsPresenterTranslateTransform"/> 
                 </ItemsPresenter.RenderTransform> 
                </ItemsPresenter> 
               </Canvas> 
              </StackPanel> 
             </UserControl> 
            </Border> 
           </Grid> 
          </StackPanel> 
         </ControlTemplate> 
        </Setter.Value> 
       </Setter> 
      </Style> 
+0

谢谢,这解决了我的问题。 – user640142 2012-02-08 15:48:20

相关问题