2014-05-19 8 views
1

내 WPF 응용 프로그램에서 SurfaceScrollViewer의 너비 크기를 변경해야합니다. 지금이 코드를 사용하고 있습니다.WPF에서 스크롤 막대의 너비를 변경하는 방법은 무엇입니까?

어떻게 단독으로 생각하나요?

<Window.Resources> 
    <Style TargetType="ScrollBar"> 
     <Setter Property="Width" Value="25"/> 
    </Style> 
</Window.Resources> 
+0

감사하지만 작동하지 않습니다

나는 샘플 레이아웃 아래에 첨부했습니다 – GibboK

답변

0

당신이해야 할 일은 SurfaceListBox (또는 스크롤 가능한 항목을 보유하기 위해 사용하는 요소)를 기반으로 스타일을 만드는 것입니다.

이렇게하면 SurfaceScrollViewer와 관련 속성을 비롯한 요소의 전체 목록이 생성됩니다. 여기서 스크롤바 요소를 찾아서 변경할 수 있습니다.

내가 무슨 뜻인지 잘 모르겠 으면, WPF 체크 박스를 재구성하는 방법에 대한 자습서를 살펴보십시오. 주석에 대한

<UserControl.Resources> 
<!-- Base Grid style for 55 dpi --> 
     <Style TargetType="{x:Type Control}" x:Key="ControlBaseStyle"> 
      <Setter Property="FocusVisualStyle" 
       Value="{x:Null}"/> 
      <Setter Property="SnapsToDevicePixels" 
       Value="False"/> 
      <Setter Property="FontFamily" 
       Value="Segoe360"/> 
      <Setter Property="FontWeight" 
       Value="Normal"/> 
      <Setter Property="FontSize" 
       Value="17"/> 
      <Setter Property="Padding" 
       Value="6,2,10,10"/> 
      <Setter Property="MinHeight" 
       Value="38"/> 
      <Setter Property="MinWidth" 
       Value="38"/> 
      <Setter Property="Margin" 
       Value="1"/> 
      <Setter Property="HorizontalContentAlignment" 
       Value="Left"/> 
      <Setter Property="VerticalContentAlignment" 
       Value="Top"/> 
      <Setter Property="BorderThickness" 
       Value="2"/> 
     </Style> 

<!-- public section --> 
     <SolidColorBrush x:Key="ControlHitAreaBrush"  
      Color="#00FFFFFF"/> 

     <Style x:Key="UnstyledContainer" TargetType="{x:Type controls:SurfaceListBoxItem}" BasedOn="{StaticResource ControlBaseStyle}"> 
      <Setter Property="Foreground" Value="{DynamicResource {x:Static controls:SurfaceColors.ListBoxItemForegroundBrushKey}}"/> 
      <Setter Property="BorderThickness" Value="0"/> 
      <Setter Property="HorizontalContentAlignment" Value="{Binding HorizontalContentAlignment, RelativeSource={RelativeSource FindAncestor, AncestorLevel=1, AncestorType={x:Type ItemsControl}}}" /> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="{x:Type controls:SurfaceListBoxItem}"> 
         <Grid x:Name="Grid" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" Margin="10,0"> 
          <Border x:Name="ButtonBody" 
           BorderThickness="{TemplateBinding BorderThickness}" 
           BorderBrush="{TemplateBinding BorderBrush}" 
           SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/> 
          <Border x:Name="PressOverlay"  
           Opacity="0" 
           SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" /> 
          <ContentPresenter x:Name="Content"           
           Margin="{TemplateBinding Padding}" 
           HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"              
           VerticalAlignment="{TemplateBinding VerticalContentAlignment}" 
           SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/> 
         </Grid> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 
     <!-- Minimum HitArea Base Style for 55 dpi--> 
     <Style x:Key="SurfaceHitAreaBaseStyle" 
      TargetType="{x:Type Control}"> 
      <Setter Property="SnapsToDevicePixels" 
       Value="False"/> 
      <Setter Property="Background" 
       Value="{StaticResource ControlHitAreaBrush}"/> 
      <Setter Property="IsTabStop" 
       Value="False"/> 
      <Setter Property="Focusable" 
       Value="False"/> 
      <Setter Property="FocusVisualStyle" 
       Value="{x:Null}"/> 
      <Setter Property="MinWidth" 
       Value="40" /> 
      <Setter Property="MinHeight" 
       Value="40" /> 
     </Style> 
     <Style x:Key="SurfaceVertScrollBarRepeatButton" 
      TargetType="{x:Type controls:SurfaceRepeatButton}" > 
      <Setter Property="Interval" 
       Value="150" /> 
      <Setter Property="BorderBrush" 
       Value="{x:Null}" /> 
      <Setter Property="Background" 
       Value="{StaticResource ControlHitAreaBrush}" /> 
      <Setter Property="OverridesDefaultStyle" Value="true"/> 
      <Setter Property="Focusable" Value="false"/> 
      <Setter Property="IsTabStop" Value="false"/> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="{x:Type controls:SurfaceRepeatButton}"> 
         <Grid Width="40" Background="{TemplateBinding Background}"> 
          <Rectangle HorizontalAlignment="Center" 
           x:Name="Line" 
           MinWidth="2" 
           Fill="{DynamicResource {x:Static controls:SurfaceColors.TrackBackgroundBrushKey}}"/> 
         </Grid> 
         <ControlTemplate.Triggers> 
          <Trigger Property="IsEnabled" 
           Value="False"> 
           <Setter Property="Fill" 
            TargetName="Line"        
            Value="{DynamicResource {x:Static controls:SurfaceColors.ThumbDisabledBrushKey}}"/> 
          </Trigger> 
         </ControlTemplate.Triggers> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 
     <!-- ScrollBar Vert Thumb --> 
     <Style x:Key="SurfaceScrollBarThumbStyle" 
      TargetType="{x:Type controls:SurfaceThumb}" 
      BasedOn="{StaticResource SurfaceHitAreaBaseStyle}"> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="{x:Type controls:SurfaceThumb}"> 
         <ControlTemplate.Resources> 
          <Storyboard x:Key="Touch"> 
           <DoubleAnimation Duration="0:0:0.05" 
            Storyboard.TargetName="Thumb" 
            Storyboard.TargetProperty="Width" 
            To="16"/> 
           <ThicknessAnimation Duration="0:0:0.05" 
            Storyboard.TargetName="Thumb" 
            Storyboard.TargetProperty="Margin" 
            To="-1,0,-1,0" /> 
          </Storyboard> 
          <Storyboard x:Key="Release"> 
           <DoubleAnimation Duration="0:0:0.1" 
            Storyboard.TargetName="Thumb" 
            Storyboard.TargetProperty="Width" 
            To="14"/> 
           <ThicknessAnimation Duration="0:0:0.1" 
            Storyboard.TargetName="Thumb" 
            Storyboard.TargetProperty="Margin" 
            To="0,0,0,0" /> 
          </Storyboard> 
         </ControlTemplate.Resources> 
         <Grid x:Name="Grid" 
          Background="{TemplateBinding Background}" 
          SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"> 
          <Rectangle x:Name="Thumb" 
           Height="Auto" 
           Width="14" 
           HorizontalAlignment="Stretch" 
           VerticalAlignment="Stretch" 
           Fill="{DynamicResource {x:Static controls:SurfaceColors.ThumbEnabledBrushKey}}" /> 
         </Grid> 
         <ControlTemplate.Triggers> 
          <Trigger Property="controls:TouchExtensions.AreAnyInputDevicesCapturedWithin" 
           Value="True"> 
           <Trigger.EnterActions> 
            <BeginStoryboard Storyboard="{StaticResource Touch}"/> 
           </Trigger.EnterActions> 
           <Trigger.ExitActions> 
            <BeginStoryboard Storyboard="{StaticResource Release}"/> 
           </Trigger.ExitActions> 
          </Trigger> 
          <Trigger Property="IsEnabled" 
           Value="False"> 
           <Setter Property="Fill" 
            TargetName="Thumb" 
            Value="{DynamicResource {x:Static controls:SurfaceColors.ThumbDisabledBrushKey}}"/> 
          </Trigger> 
         </ControlTemplate.Triggers> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 
     <!-- ScrollBar RepeatButton --> 
     <Style x:Key="SurfaceHorzScrollBarRepeatButton" 
      TargetType="{x:Type controls:SurfaceRepeatButton}" > 
      <Setter Property="Interval" 
       Value="150" /> 
      <Setter Property="BorderBrush" 
       Value="{x:Null}" /> 
      <Setter Property="Background" 
       Value="{StaticResource ControlHitAreaBrush}" /> 
      <Setter Property="OverridesDefaultStyle" Value="true"/> 
      <Setter Property="Focusable" Value="false"/> 
      <Setter Property="IsTabStop" Value="false"/> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="{x:Type controls:SurfaceRepeatButton}"> 
         <Grid Height="40" Background="{TemplateBinding Background}"> 
          <Rectangle VerticalAlignment="Center" 
           x:Name="Line" 
           MinHeight="2" 
           Fill="{DynamicResource {x:Static controls:SurfaceColors.TrackBackgroundBrushKey}}"/> 
         </Grid> 
         <ControlTemplate.Triggers> 
          <Trigger Property="IsEnabled" 
           Value="False"> 
           <Setter Property="Fill" 
            TargetName="Line"        
            Value="{DynamicResource {x:Static controls:SurfaceColors.ThumbDisabledBrushKey}}"/> 
          </Trigger> 
         </ControlTemplate.Triggers> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 
     <Style x:Key="SurfaceScrollBarHorizThumbStyle" 
      TargetType="{x:Type controls:SurfaceThumb}" 
      BasedOn="{StaticResource SurfaceHitAreaBaseStyle}"> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="{x:Type controls:SurfaceThumb}"> 
         <ControlTemplate.Resources> 
      <!-- Vertical orientation --> 
          <Storyboard x:Key="Touch"> 
           <DoubleAnimation Duration="0:0:0.05" 
            Storyboard.TargetName="Thumb" 
            Storyboard.TargetProperty="Height" 
            To="16"/> 
           <ThicknessAnimation Duration="0:0:0.05" 
            Storyboard.TargetName="Thumb" 
            Storyboard.TargetProperty="Margin" 
            To="0,-1,0,-1" /> 
          </Storyboard> 
          <Storyboard x:Key="Release"> 
           <DoubleAnimation Duration="0:0:0.1" 
            Storyboard.TargetName="Thumb" 
            Storyboard.TargetProperty="Height" 
            To="14"/> 
           <ThicknessAnimation Duration="0:0:0.1" 
            Storyboard.TargetName="Thumb" 
            Storyboard.TargetProperty="Margin" 
            To="0,0,0,0" /> 
          </Storyboard> 
         </ControlTemplate.Resources> 
         <Grid x:Name="Grid" 
          Background="{TemplateBinding Background}" 
          SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" > 
          <Rectangle x:Name="Thumb" 
           Width="Auto" 
           Height="14" 
           HorizontalAlignment="Stretch" 
           VerticalAlignment="Stretch" 
           Fill="{DynamicResource {x:Static controls:SurfaceColors.ThumbEnabledBrushKey}}" /> 
         </Grid> 
         <ControlTemplate.Triggers> 
          <Trigger Property="controls:TouchExtensions.AreAnyInputDevicesCapturedWithin" 
           Value="True"> 
           <Trigger.EnterActions> 
            <BeginStoryboard Storyboard="{StaticResource Touch}"/> 
           </Trigger.EnterActions> 
           <Trigger.ExitActions> 
            <BeginStoryboard Storyboard="{StaticResource Release}"/> 
           </Trigger.ExitActions> 
          </Trigger> 
          <Trigger Property="IsEnabled" 
           Value="False"> 
           <Setter Property="Fill" 
            TargetName="Thumb" 
            Value="{DynamicResource {x:Static controls:SurfaceColors.ThumbDisabledBrushKey}}"/> 
          </Trigger> 
         </ControlTemplate.Triggers> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 
    <!-- ScrollBar --> 
     <Style x:Key="SurfaceScrollBarStyle" 
      TargetType="{x:Type controls:SurfaceScrollBar}" 
     > 
      <Style.Resources> 
       <System:Double x:Key="{x:Static SystemParameters.VerticalScrollBarButtonHeightKey}">38</System:Double> 
       <System:Double x:Key="{x:Static SystemParameters.HorizontalScrollBarButtonWidthKey}">38</System:Double> 
      </Style.Resources> 
      <Setter Property="Stylus.IsPressAndHoldEnabled" 
       Value="False"/> 
      <Setter Property="Stylus.IsFlicksEnabled" 
       Value="False"/> 
      <Setter Property="Width" 
       Value="38"/> 
      <Setter Property="Height" 
       Value="Auto"/> 
      <Setter Property="Template"> 
       <Setter.Value> 
     <!-- vertical scroll bar --> 
        <ControlTemplate TargetType="{x:Type controls:SurfaceScrollBar}"> 
         <Grid x:Name="GridRoot" Background="{TemplateBinding Background}"> 
          <Border x:Name="Track" 
           VerticalAlignment="Stretch" 
           HorizontalAlignment="Stretch"> 
           <Track x:Name="PART_Track" 
            IsDirectionReversed="True"> 
            <Track.IncreaseRepeatButton> 
             <controls:SurfaceRepeatButton x:Name="IncreaseRepeat" 
              Background="{TemplateBinding Background}" 
              HorizontalAlignment="Center" 
              Style="{StaticResource SurfaceVertScrollBarRepeatButton}" 
              Command="ScrollBar.PageDownCommand"/> 
            </Track.IncreaseRepeatButton> 
            <Track.DecreaseRepeatButton> 
             <controls:SurfaceRepeatButton x:Name="DecreaseRepeat" 
              Background="{TemplateBinding Background}" 
              HorizontalAlignment="Center" 
              Style="{StaticResource SurfaceVertScrollBarRepeatButton}" 
              Command="ScrollBar.PageUpCommand"/> 
            </Track.DecreaseRepeatButton> 
            <Track.Thumb> 
             <controls:SurfaceThumb Style="{StaticResource SurfaceScrollBarThumbStyle}" 
              Background="{TemplateBinding Background}" 
              HorizontalAlignment="Center" 
              x:Name="Thumb"/> 
            </Track.Thumb> 
           </Track> 
          </Border> 
         </Grid> 
         <ControlTemplate.Triggers> 
      <!-- Animates Scrollbar from small to large state --> 
          <Trigger Property="IsEnabled" 
           Value="False"> 
           <Setter Property="IsEnabled" 
            TargetName="PART_Track" 
            Value="False"/> 
          </Trigger> 
         </ControlTemplate.Triggers> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 

      <Style.BasedOn> 
       <StaticResource ResourceKey="SurfaceHitAreaBaseStyle"/> 
      </Style.BasedOn> 

      <Style.Triggers> 
    <!-- Horizontal orientation --> 
       <Trigger Property="Orientation" Value="Horizontal"> 
        <Setter Property="Width" 
         Value="Auto"/> 
        <Setter Property="Height" 
         Value="38"/> 
     <!-- change the whole template --> 
        <Setter Property="Template"> 
         <Setter.Value> 
          <ControlTemplate TargetType="{x:Type controls:SurfaceScrollBar}"> 
           <Grid x:Name="GridRoot" Background="{TemplateBinding Background}"> 
            <Border x:Name="Track" 
             VerticalAlignment="Stretch" 
             HorizontalAlignment="Stretch"> 
             <Track x:Name="PART_Track"> 
              <Track.DecreaseRepeatButton> 
               <controls:SurfaceRepeatButton x:Name="DecreaseRepeat" 
                Background="{TemplateBinding Background}" 
                VerticalAlignment="Center" 
                Style="{StaticResource SurfaceHorzScrollBarRepeatButton}"             
                Command="ScrollBar.PageLeftCommand" /> 
              </Track.DecreaseRepeatButton> 
              <Track.IncreaseRepeatButton> 
               <controls:SurfaceRepeatButton x:Name="IncreaseRepeat" 
                Background="{TemplateBinding Background}" 
                VerticalAlignment="Center" 
                Style="{StaticResource SurfaceHorzScrollBarRepeatButton}" 
                Command="ScrollBar.PageRightCommand"/> 
              </Track.IncreaseRepeatButton> 
              <Track.Thumb> 
               <controls:SurfaceThumb Style="{StaticResource SurfaceScrollBarHorizThumbStyle}"  
                Background="{TemplateBinding Background}" 
                VerticalAlignment="Center" 
                x:Name="Thumb"/> 
              </Track.Thumb> 
             </Track> 
            </Border> 
           </Grid> 
           <ControlTemplate.Triggers> 
       <!-- Animates Scrollbar from small to large state --> 
            <Trigger Property="IsEnabled" 
             Value="False"> 
             <Setter Property="Opacity" 
              TargetName="IncreaseRepeat" 
              Value="0.33"/> 
             <Setter Property="Opacity" 
              TargetName="DecreaseRepeat" 
              Value="0.33"/> 
             <Setter Property="IsEnabled" 
              TargetName="PART_Track" 
              Value="False"/> 
            </Trigger> 
           </ControlTemplate.Triggers> 
          </ControlTemplate> 
         </Setter.Value> 
        </Setter> 
       </Trigger> 
      </Style.Triggers> 
     </Style> 

<!-- ScrollViewerBase --> 
     <Style x:Key="SurfaceScrollViewerStyle" 
      TargetType="{x:Type controls:SurfaceScrollViewer}"> 
      <Setter Property="Elasticity" 
       Value="0.4,0.4" /> 
      <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" 
       Value="Auto" /> 
      <Setter Property="ScrollViewer.VerticalScrollBarVisibility" 
       Value="Auto" /> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="{x:Type controls:SurfaceScrollViewer}"> 
         <Grid Background="{TemplateBinding Background}" 
          HorizontalAlignment="Stretch" 
          VerticalAlignment="Stretch"> 
          <Grid.ColumnDefinitions> 
           <ColumnDefinition Width="*" /> 
           <ColumnDefinition Width="Auto" /> 
          </Grid.ColumnDefinitions> 
          <Grid.RowDefinitions> 
           <RowDefinition Height="*" /> 
           <RowDefinition Height="Auto" /> 
          </Grid.RowDefinitions> 
          <Border x:Name="PART_ElasticBorder" 
           Background="{TemplateBinding Background}"> 
           <ScrollContentPresenter 
            Margin="-1,-1,-1,-1" 
            Grid.Column="0" 
            Grid.ColumnSpan="1" 
            Grid.Row="0" 
            Grid.RowSpan="1" 
            Content="{TemplateBinding Content}" 
            ContentTemplate="{TemplateBinding ContentTemplate}" 
            CanContentScroll="{TemplateBinding CanContentScroll}" 
            CanHorizontallyScroll="False" 
            CanVerticallyScroll="False" 
            ScrollViewer.HorizontalScrollBarVisibility="Disabled" /> 
          </Border> 

          <controls:SurfaceScrollBar Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}" 
           x:Name="PART_HorizontalScrollBar" 
           Grid.Column="0" 
           Grid.Row="1" 
           Orientation="Horizontal" 
           Maximum="{TemplateBinding ScrollableWidth}" 
           Minimum="0" 
           Value="{Binding HorizontalOffset, Mode=OneWay, RelativeSource={RelativeSource TemplatedParent}}" 
           AutomationProperties.AutomationId="HorizontalScrollBar" 
           Height="Auto" 
           Style="{StaticResource SurfaceScrollBarStyle}" 
           LargeChange="1" 
           ViewportSize="{TemplateBinding ViewportWidth}" 
           ScrollViewer.HorizontalScrollBarVisibility="Disabled" 
           HorizontalContentAlignment="Stretch" 
           VerticalContentAlignment="Stretch" 
           HorizontalAlignment="Stretch" 
           Foreground="{x:Null}"/> 
          <controls:SurfaceScrollBar Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}" 
           x:Name="PART_VerticalScrollBar"       
           Grid.Column="1" 
           Grid.Row="0" 
           Orientation="Vertical" 
           Maximum="{TemplateBinding ScrollableHeight}" 
           Minimum="0" 
           Value="{Binding VerticalOffset, Mode=OneWay, RelativeSource={RelativeSource TemplatedParent}}" 
           AutomationProperties.AutomationId="VerticalScrollBar" 
           Width="Auto" 
           Style="{StaticResource SurfaceScrollBarStyle}" 
           LargeChange="1" 
           ViewportSize="{TemplateBinding ViewportHeight}" 
           ScrollViewer.HorizontalScrollBarVisibility="Disabled" 
           HorizontalContentAlignment="Stretch" 
           VerticalContentAlignment="Stretch" 
           HorizontalAlignment="Stretch" 
           Foreground="{x:Null}" 
           IsEnabled="True"/> 
         </Grid> 
         <ControlTemplate.Triggers> 
          <Trigger Property="IsEnabled" 
           Value="False"> 
           <Setter Property="IsEnabled" 
            TargetName="PART_HorizontalScrollBar" 
            Value="False" /> 
           <Setter Property="IsEnabled" 
            TargetName="PART_VerticalScrollBar" 
            Value="False" /> 
          </Trigger> 
         </ControlTemplate.Triggers> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 

<!-- Listbox ScrollView --> 
     <Style x:Key="SurfaceListBoxScrollViewerStyle" 
      TargetType="{x:Type controls:SurfaceScrollViewer}" 
      BasedOn="{StaticResource SurfaceScrollViewerStyle}"> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="{x:Type controls:SurfaceScrollViewer}"> 
         <Grid 
          HorizontalAlignment="Stretch" 
          Margin="{TemplateBinding BorderThickness}" 
          VerticalAlignment="Stretch" 
          SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"> 
          <Grid.ColumnDefinitions> 
           <ColumnDefinition Width="*" /> 
           <ColumnDefinition Width="Auto"/> 
          </Grid.ColumnDefinitions> 
          <Grid.RowDefinitions> 
           <RowDefinition Height="*"/> 
           <RowDefinition Height="Auto"/> 
          </Grid.RowDefinitions> 
          <Border x:Name="PART_ElasticBorder" 
           SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" 
           BorderBrush="Transparent" 
           > 
           <ScrollContentPresenter Margin="{TemplateBinding Padding}" 
            Content="{TemplateBinding Content}" 
            ContentTemplate="{TemplateBinding ContentTemplate}" 
            CanContentScroll="{TemplateBinding CanContentScroll}" 
            CanHorizontallyScroll="False" 
            CanVerticallyScroll="False" 
            Grid.ColumnSpan="1" 
            Grid.RowSpan="1" 
            SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/> 
          </Border> 
          <controls:SurfaceScrollBar Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}" 
           x:Name="PART_HorizontalScrollBar" 
           Grid.Row="1" 
           Orientation="Horizontal" 
           ViewportSize="{TemplateBinding ViewportWidth}" 
           Maximum="{TemplateBinding ScrollableWidth}" 
           Minimum="0" 
           Background="{TemplateBinding Background}" 
           Value="{Binding HorizontalOffset, Mode=OneWay, RelativeSource={RelativeSource TemplatedParent}}" 
           AutomationProperties.AutomationId="HorizontalScrollBar" 
           Height="Auto"         
           Style="{StaticResource SurfaceScrollBarStyle}"         
           LargeChange="1" 
           ClipToBounds="True" 
           SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" /> 
          <controls:SurfaceScrollBar Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}" 
           x:Name="PART_VerticalScrollBar" 
           Grid.Column="1" 
           Grid.Row="0" 
           Orientation="Vertical" 
           ViewportSize="{TemplateBinding ViewportHeight}" 
           Maximum="{TemplateBinding ScrollableHeight}" 
           Minimum="0" 

           Value="{Binding VerticalOffset, Mode=OneWay, RelativeSource={RelativeSource TemplatedParent}}" 
           AutomationProperties.AutomationId="VerticalScrollBar" 
           Width="Auto"         
           Style="{StaticResource SurfaceScrollBarStyle}"         
           LargeChange="1" 
           ClipToBounds="True" 
           SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/> 
          <Border x:Name="Container" 
           Grid.Column="1" 
           Grid.Row="1" 
           SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" 
           BorderBrush="Transparent" 
           /> 
         </Grid> 
         <ControlTemplate.Triggers> 
          <Trigger Property="IsEnabled" 
           Value="False"> 
           <Setter Property="IsEnabled" 
            TargetName="PART_HorizontalScrollBar" 
            Value="False"/> 
           <Setter Property="IsEnabled" 
            TargetName="PART_VerticalScrollBar" 
            Value="False"/> 
           <Setter Property="BorderBrush" 
            TargetName="PART_ElasticBorder" 
            Value="{DynamicResource {x:Static controls:SurfaceColors.ControlBorderDisabledBrushKey}}"/> 
          </Trigger> 
         </ControlTemplate.Triggers> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 

<!-- ListBox --> 
     <Style x:Key="UnstyledList" TargetType="{x:Type controls:SurfaceListBox}" 
      BasedOn="{StaticResource ControlBaseStyle}"> 
      <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" 
       Value="Auto" /> 
      <Setter Property="ScrollViewer.VerticalScrollBarVisibility" 
       Value="Auto" /> 
      <Setter Property="ScrollViewer.CanContentScroll" 
       Value="False" /> 
      <Setter Property="controls:SurfaceScrollViewer.Elasticity" 
       Value="0,0.4" /> 
      <Setter Property="MinHeight" 
       Value="80" /> 
      <Setter Property="Foreground" 
       Value="{DynamicResource {x:Static controls:SurfaceColors.ButtonForegroundBrushKey}}"/> 
      <Setter Property="BorderBrush" 
       Value="{DynamicResource {x:Static controls:SurfaceColors.ListBoxBorderBrushKey}}"/> 
      <Setter Property="Padding" 
       Value="0" /> 
      <Setter Property="BorderThickness" 
       Value="2" /> 
      <Setter Property="Margin" 
       Value="0" /> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="{x:Type controls:SurfaceListBox}"> 
         <Grid SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" > 
          <controls:SurfaceScrollViewer 
           Style="{StaticResource SurfaceListBoxScrollViewerStyle}" 
           HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}" 
           VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}" 
           Focusable="False" 
           Foreground="{TemplateBinding Foreground}" 
           Width="Auto" 
           Height="Auto" 
           MinHeight="{TemplateBinding MinHeight}" 
           MinWidth="{TemplateBinding MinWidth}" 
           x:Name="scrollViewer" 
           Elasticity="{TemplateBinding controls:SurfaceScrollViewer.Elasticity}"> 
           <ItemsPresenter ClipToBounds="False" 
            MinHeight="{TemplateBinding MinHeight}" 
            MinWidth="{TemplateBinding MinWidth}"/> 
          </controls:SurfaceScrollViewer> 
          <Border x:Name="Border" 
           BorderBrush="{TemplateBinding BorderBrush}" 
           BorderThickness="{TemplateBinding BorderThickness}" /> 
         </Grid> 
         <ControlTemplate.Triggers> 
          <Trigger Property="IsGrouping" 
           Value="True"> 
           <Setter Property="ScrollViewer.CanContentScroll" 
            Value="False" /> 
          </Trigger> 
         </ControlTemplate.Triggers> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 
    </UserControl.Resources> 



<s:SurfaceListBox x:Name="someList" Background="{x:Null}" Foreground="{x:Null}" BorderBrush="{x:Null}" ItemContainerStyle="{DynamicResource UnstyledContainer}" Style="{DynamicResource UnstyledList}" />