2015-09-04 84 views
0

請參閱附加圖片中的問題,並讓我知道如何解決它們,如果您知道。WPF中ListView的問題

- 如果我有大量的項目,一切都看起來不錯 - 如果周圍的6個項目,然後我在上面,滾動條的底部得到空的空間 - 如果3個或更少的項目,然後我得到的之間的不必要間距項目

請參閱列表中的代碼:

<!--list to hold thumbnails for each slide--> 
      <Border CornerRadius="5" BorderThickness="3" BorderBrush="White" Grid.Row="6" Grid.Column="6" Grid.ColumnSpan="10" Grid.RowSpan="27"> 

       <ListView Name="Thumbnails" HorizontalContentAlignment ="Center" VerticalContentAlignment="Top" Padding="0" Background ="#81AFD3" Grid.Row="6" Grid.Column="6" Grid.ColumnSpan="10" Grid.RowSpan="27" ScrollViewer.VerticalScrollBarVisibility="Visible" SelectionChanged="Thumbnails_SelectionChanged" > 

        <ListView.ItemContainerStyle> 
         <Style TargetType="ListViewItem"> 
          <Style.Triggers> 
           <Trigger Property="IsMouseOver" Value="True"> 
            <Setter Property="IsSelected" Value="True"/> 
           </Trigger> 
          </Style.Triggers> 
         </Style> 
        </ListView.ItemContainerStyle> 


        <ListView.ItemsPanel> 
         <ItemsPanelTemplate> 
          <UniformGrid Columns="1"/> 
         </ItemsPanelTemplate> 
        </ListView.ItemsPanel> 

        <ListView.Resources> 

         <!--RESOURCES FOR SCROLLBAR--> 

         <!--Control colors.--> 
         <Color x:Key="WindowColor">#FFE8EDF9</Color> 
         <Color x:Key="ContentAreaColorLight">#FFC5CBF9</Color> 
         <Color x:Key="ContentAreaColorDark">#FF7381F9</Color> 

         <Color x:Key="DisabledControlLightColor">#FFE8EDF9</Color> 
         <Color x:Key="DisabledControlDarkColor">#FFC5CBF9</Color> 
         <Color x:Key="DisabledForegroundColor">#FF888888</Color> 

         <Color x:Key="SelectedBackgroundColor">#FFC5CBF9</Color> 
         <Color x:Key="SelectedUnfocusedColor">#FFDDDDDD</Color> 

         <Color x:Key="ControlLightColor">White</Color> 
         <Color x:Key="ControlMediumColor">#FF7381F9</Color> 
         <Color x:Key="ControlDarkColor">#FF211AA9</Color> 

         <Color x:Key="ControlMouseOverColor">#FF3843C4</Color> 
         <Color x:Key="ControlPressedColor">#FF211AA9</Color> 


         <Color x:Key="GlyphColor">#FF444444</Color> 
         <Color x:Key="GlyphMouseOver">sc#1, 0.004391443, 0.002428215, 0.242281124</Color> 

         <!--Border colors--> 
         <Color x:Key="BorderLightColor">#FFCCCCCC</Color> 
         <Color x:Key="BorderMediumColor">#FF888888</Color> 
         <Color x:Key="BorderDarkColor">#FF444444</Color> 

         <Color x:Key="PressedBorderLightColor">#FF888888</Color> 
         <Color x:Key="PressedBorderDarkColor">#FF444444</Color> 

         <Color x:Key="DisabledBorderLightColor">#FFAAAAAA</Color> 
         <Color x:Key="DisabledBorderDarkColor">#FF888888</Color> 

         <Color x:Key="DefaultBorderBrushDarkColor">Black</Color> 

         <!--Control-specific resources.--> 
         <Color x:Key="HeaderTopColor">#FFC5CBF9</Color> 
         <Color x:Key="DatagridCurrentCellBorderColor">Black</Color> 
         <Color x:Key="SliderTrackDarkColor">#FFC5CBF9</Color> 

         <Color x:Key="NavButtonFrameColor">#FF3843C4</Color> 

         <LinearGradientBrush x:Key="MenuPopupBrush" 
        EndPoint="0.5,1" 
        StartPoint="0.5,0"> 
          <GradientStop Color="{DynamicResource ControlLightColor}" 
       Offset="0" /> 
          <GradientStop Color="{DynamicResource ControlMediumColor}" 
       Offset="0.5" /> 
          <GradientStop Color="{DynamicResource ControlLightColor}" 
       Offset="1" /> 
         </LinearGradientBrush> 

         <LinearGradientBrush x:Key="ProgressBarIndicatorAnimatedFill" 
        StartPoint="0,0" 
        EndPoint="1,0"> 
          <LinearGradientBrush.GradientStops> 
           <GradientStopCollection> 
            <GradientStop Color="#000000FF" 
        Offset="0" /> 
            <GradientStop Color="#600000FF" 
        Offset="0.4" /> 
            <GradientStop Color="#600000FF" 
        Offset="0.6" /> 
            <GradientStop Color="#000000FF" 
        Offset="1" /> 
           </GradientStopCollection> 
          </LinearGradientBrush.GradientStops> 
         </LinearGradientBrush> 

         <!--RESOURCES FOR SCROLLBAR END--> 

         <Style x:Key="ScrollBarLineButton" TargetType="{x:Type RepeatButton}"> 
          <Setter Property="SnapsToDevicePixels" Value="True" /> 
          <Setter Property="OverridesDefaultStyle" Value="true" /> 
          <Setter Property="Focusable" Value="false" /> 
          <Setter Property="Template"> 
           <Setter.Value> 
            <ControlTemplate TargetType="{x:Type RepeatButton}"> 
             <!--HERE WE ADJUST PROPERTIES ON TOP AND BOTTOM BUTTONS --> 
             <Border x:Name="Border" CornerRadius="4,4,4,4" BorderThickness="0" > 
              <Border.BorderBrush> 
               <LinearGradientBrush StartPoint="0,0" EndPoint="0,1"> 
                <LinearGradientBrush.GradientStops> 
                 <GradientStopCollection> 
                  <GradientStop Color="{DynamicResource BorderMediumColor}" Offset="0.0" /> 
                  <GradientStop Color="{DynamicResource BorderDarkColor}" Offset="1.0" /> 
                 </GradientStopCollection> 
                </LinearGradientBrush.GradientStops> 
               </LinearGradientBrush> 
              </Border.BorderBrush> 
              <Border.Background> 
               <LinearGradientBrush StartPoint="0,0" EndPoint="0,1"> 
                <LinearGradientBrush.GradientStops> 
                 <GradientStopCollection> 
                  <!--HERE WE SET THE KEYS COLOR--> 
                  <GradientStop Color="White"/> 
                  <GradientStop Color="White" Offset="0" /> 
                 </GradientStopCollection> 
                </LinearGradientBrush.GradientStops> 
               </LinearGradientBrush> 
              </Border.Background> 
              <VisualStateManager.VisualStateGroups> 
               <VisualStateGroup x:Name="CommonStates"> 
                <VisualState x:Name="Normal" /> 
                <VisualState x:Name="MouseOver" /> 
                <VisualState x:Name="Pressed"> 
                 <Storyboard> 
                  <ColorAnimationUsingKeyFrames Storyboard.TargetName="Border" Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[1].(GradientStop.Color)"> 
                   <EasingColorKeyFrame KeyTime="0" Value="{StaticResource ControlPressedColor}" /> 
                  </ColorAnimationUsingKeyFrames> 
                 </Storyboard> 
                </VisualState> 
                <VisualState x:Name="Disabled"> 
                 <Storyboard> 
                  <ColorAnimationUsingKeyFrames Storyboard.TargetName="Arrow" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)"> 
                   <EasingColorKeyFrame KeyTime="0" Value="#79B0D4" /> 
                  </ColorAnimationUsingKeyFrames> 
                 </Storyboard> 
                </VisualState> 
               </VisualStateGroup> 
              </VisualStateManager.VisualStateGroups> 
              <Path x:Name="Arrow" HorizontalAlignment="Center" VerticalAlignment="Center" Data="{Binding Content, RelativeSource={RelativeSource TemplatedParent}}" > 
               <Path.Fill> 
                <!--HERE WE SET THE ARROW COLOR--> 
                <SolidColorBrush Color="#79B0D4"/> 
               </Path.Fill> 
              </Path> 
             </Border> 
            </ControlTemplate> 
           </Setter.Value> 
          </Setter> 
         </Style> 

         <Style x:Key="ScrollBarPageButton" TargetType="{x:Type RepeatButton}"> 
          <Setter Property="SnapsToDevicePixels" Value="True" /> 
          <Setter Property="OverridesDefaultStyle" Value="true" /> 
          <Setter Property="IsTabStop" Value="false" /> 
          <Setter Property="Focusable" Value="false" /> 
          <Setter Property="Template"> 
           <Setter.Value> 
            <ControlTemplate TargetType="{x:Type RepeatButton}"> 
             <!--HERE WE SET Background buttons PROPERTIES--> 
             <Border Background="Black" Height="0"/> 
            </ControlTemplate> 
           </Setter.Value> 
          </Setter> 
         </Style> 



         <Style x:Key="ScrollBarThumb" TargetType="{x:Type Thumb}"> 
          <Setter Property="SnapsToDevicePixels" Value="True" /> 
          <Setter Property="OverridesDefaultStyle" Value="true" /> 
          <Setter Property="IsTabStop" Value="false" /> 
          <Setter Property="Focusable" Value="false" /> 
          <Setter Property="Template"> 
           <Setter.Value> 
            <ControlTemplate TargetType="{x:Type Thumb}"> 
             <!--HERE WE SET THE THUMB COLOR CORNER AND BORDER--> 
             <Border CornerRadius="1" Background="#D8E8F5" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="0" Width="16" Height="250" /> 
            </ControlTemplate> 
           </Setter.Value> 
          </Setter> 
         </Style> 

         <ControlTemplate x:Key="VerticalScrollBar" TargetType="{x:Type ScrollBar}"> 
          <Grid> 
           <Grid.RowDefinitions> 
            <RowDefinition MaxHeight="18" /> 
            <RowDefinition Height="0.00001*" /> 
            <RowDefinition MaxHeight="18" /> 
           </Grid.RowDefinitions> 
           <!--HERE WE SET THE ENTIRE SCROLLBAR BACKROUND AND CORNERS--> 
           <Border Grid.RowSpan="3" CornerRadius="5" Background="#A9CCE5" /> 
           <RepeatButton Grid.Row="0" Style="{StaticResource ScrollBarLineButton}" Height="18" Command="ScrollBar.LineUpCommand" Content="M 0 4 L 8 4 L 4 0 Z" /> 
           <Track x:Name="PART_Track" Grid.Row="1" IsDirectionReversed="true"> 
            <Track.DecreaseRepeatButton> 
             <RepeatButton Style="{StaticResource ScrollBarPageButton}" Command="ScrollBar.PageUpCommand" /> 
            </Track.DecreaseRepeatButton> 
            <Track.Thumb> 
             <Thumb Style="{StaticResource ScrollBarThumb}" Margin="1,0,1,0"> 
              <Thumb.BorderBrush> 

               <LinearGradientBrush StartPoint="0,0" EndPoint="1,0"> 
                <LinearGradientBrush.GradientStops> 
                 <GradientStopCollection> 
                  <GradientStop Color="{DynamicResource BorderLightColor}" Offset="0.0" /> 
                  <GradientStop Color="{DynamicResource BorderDarkColor}" Offset="1.0" /> 
                 </GradientStopCollection> 
                </LinearGradientBrush.GradientStops> 
               </LinearGradientBrush> 

              </Thumb.BorderBrush> 
              <Thumb.Background> 

               <LinearGradientBrush StartPoint="0,0" EndPoint="1,0"> 
                <LinearGradientBrush.GradientStops> 
                 <GradientStopCollection> 
                  <GradientStop Color="{DynamicResource ControlLightColor}" Offset="0.0" /> 
                  <GradientStop Color="{DynamicResource ControlMediumColor}" Offset="1.0" /> 
                 </GradientStopCollection> 
                </LinearGradientBrush.GradientStops> 
               </LinearGradientBrush> 

              </Thumb.Background> 
             </Thumb> 
            </Track.Thumb> 
            <Track.IncreaseRepeatButton> 
             <RepeatButton Style="{StaticResource ScrollBarPageButton}" Command="ScrollBar.PageDownCommand" /> 
            </Track.IncreaseRepeatButton> 
           </Track> 
           <RepeatButton Grid.Row="3" Style="{StaticResource ScrollBarLineButton}" Height="18" Command="ScrollBar.LineDownCommand" Content="M 0 0 L 4 4 L 8 0 Z" /> 
          </Grid> 
         </ControlTemplate> 

         <ControlTemplate x:Key="HorizontalScrollBar" TargetType="{x:Type ScrollBar}"> 
          <Grid> 
           <Grid.ColumnDefinitions> 
            <ColumnDefinition MaxWidth="18" /> 
            <ColumnDefinition Width="0.00001*" /> 
            <ColumnDefinition MaxWidth="18" /> 
           </Grid.ColumnDefinitions> 
           <Border Grid.ColumnSpan="3" CornerRadius="2" Background="#F0F0F0" /> 
           <RepeatButton Grid.Column="0" Style="{StaticResource ScrollBarLineButton}" Width="18" Command="ScrollBar.LineLeftCommand" Content="M 4 0 L 4 8 L 0 4 Z" /> 
           <Track x:Name="PART_Track" Grid.Column="1" IsDirectionReversed="False"> 
            <Track.DecreaseRepeatButton> 
             <RepeatButton Style="{StaticResource ScrollBarPageButton}" Command="ScrollBar.PageLeftCommand" /> 
            </Track.DecreaseRepeatButton> 
            <Track.Thumb> 
             <Thumb Style="{StaticResource ScrollBarThumb}" Margin="0,1,0,1"> 

              <Thumb.BorderBrush> 

               <LinearGradientBrush StartPoint="0,0" EndPoint="1,0"> 
                <LinearGradientBrush.GradientStops> 
                 <GradientStopCollection> 
                  <GradientStop Color="{DynamicResource BorderLightColor}" Offset="0.0" /> 
                  <GradientStop Color="{DynamicResource BorderDarkColor}" Offset="1.0" /> 
                 </GradientStopCollection> 
                </LinearGradientBrush.GradientStops> 
               </LinearGradientBrush> 

              </Thumb.BorderBrush> 
              <Thumb.Background> 

               <LinearGradientBrush StartPoint="0,0" EndPoint="0,1"> 
                <LinearGradientBrush.GradientStops> 
                 <GradientStopCollection> 
                  <GradientStop Color="{DynamicResource ControlLightColor}" Offset="0.0" /> 
                  <GradientStop Color="{DynamicResource ControlMediumColor}" Offset="1.0" /> 
                 </GradientStopCollection> 
                </LinearGradientBrush.GradientStops> 
               </LinearGradientBrush> 

              </Thumb.Background> 
             </Thumb> 
            </Track.Thumb> 
            <Track.IncreaseRepeatButton> 
             <RepeatButton Style="{StaticResource ScrollBarPageButton}" Command="ScrollBar.PageRightCommand" /> 
            </Track.IncreaseRepeatButton> 
           </Track> 
           <RepeatButton Grid.Column="3" Style="{StaticResource ScrollBarLineButton}" Width="18" Command="ScrollBar.LineRightCommand" Content="M 0 0 L 4 4 L 0 8 Z" /> 
          </Grid> 
         </ControlTemplate> 

         <Style x:Key="{x:Type ScrollBar}" TargetType="{x:Type ScrollBar}"> 
          <Setter Property="SnapsToDevicePixels" Value="True" /> 
          <Setter Property="OverridesDefaultStyle" Value="true" /> 
          <!--<Setter Property="Value" Value="20" />--> 
          <Style.Triggers> 
           <Trigger Property="Orientation" Value="Horizontal"> 
            <Setter Property="Width" Value="Auto" /> 
            <Setter Property="Height" Value="18" /> 
            <Setter Property="Template" Value="{StaticResource HorizontalScrollBar}" /> 
           </Trigger> 
           <Trigger Property="Orientation" Value="Vertical"> 
            <Setter Property="Width" Value="18" /> 
            <Setter Property="Height" Value="Auto" /> 
            <Setter Property="Template" Value="{StaticResource VerticalScrollBar}" /> 
           </Trigger> 
          </Style.Triggers> 
         </Style> 


        </ListView.Resources> 


       </ListView> 

      </Border> 

OK if large number of items

If around 6 items then I get empty space on top and bottom of the scroll bar

if 3 or less items, then I get unwanted spacing between the items

+0

immages是一個非常低的質量。更進一步,你的問題更爲廣泛。只需選擇一個問題,並將其與理解問題所需的信息,解決問題所需的信息以及描述不符合預期的內容結合起來。最後請在發佈此類問題之前閱讀本文:http://stackoverflow.com/help/how-to-ask – HimBromBeere

回答

3
<ListView.ItemsPanel> 
    <ItemsPanelTemplate> 
     <UniformGrid Columns="1"/> 
    </ItemsPanelTemplate> 
</ListView.ItemsPanel> 

這這裏是你的問題的根源。 UniformGrid正在使用整個可用空間並創建同樣高的單元格來填充它。

使用StackPanel作爲您的物品面板,或將VerticalAlignment="Top"設置爲UniformGrid

+0

非常感謝。這確實解決了物品之間間距的問題。我剛剛評論說,該塊。但是,滾動條頂部和底部的間距仍然存在。 – Ivan

+1

我不明白「頂部和底部的滾動條間距」是什麼意思。我沒有看到圖像中的滾動條有任何問題。 – almulo

+0

哦,在第二張圖片中,你會看到它如何不會一直向上......我沒有隨意將它放在那個位置。這是當我有大約6個項目時可以達到的最大值......並且同樣的東西適用於底部 – Ivan