9

ListViewa 内に 2 つのオブジェクトを構築StackPanelし、すべてのItemTemplateタイルを互いに「接触」させようとしています ( ListViews 内にマージンやパディングがないことを意味します)。Windows 8 Metro には、ある種の埋め込み/マージンが組み込まれているようです。私の質問:これらを削除または設定するにはどうすればよい0ですか?

これが私のコードです：

<StackPanel x:Name="teesSP" 
            HorizontalAlignment="Left" 
            Orientation="Horizontal" 
            VerticalAlignment="Top" >

    <ListView x:Name="timesLV1"            
              SelectionMode="Multiple" 
              SelectionChanged="timesLV_Click" 
              ItemTemplate="{StaticResource TimeTileTemplate}">
        <ListView.ItemContainerStyle>
            <Style TargetType="ListViewItem">
                <Setter Property="Padding" Value="0"/>
                <Setter Property="Margin" Value="0"/>
            </Style>
        </ListView.ItemContainerStyle>
    </ListView>

    <ListView x:Name="timesLV2"            
              SelectionMode="Multiple" 
              SelectionChanged="timesLV_Click" 
              ItemTemplate="{StaticResource TimeTileTemplate}">
        <ListView.ItemContainerStyle>
            <Style TargetType="ListViewItem">
                <Setter Property="Padding" Value="0"/>
                <Setter Property="Margin" Value="0"/>
            </Style>
        </ListView.ItemContainerStyle>
    </ListView>

</StackPanel>

私ItemTemplateは：

<DataTemplate x:Key="TimeTileTemplate">
    <Grid HorizontalAlignment="Center" Background="White" >
        <Border BorderBrush="Black" BorderThickness="2" >
            <StackPanel Margin="0,0,0,0" Orientation="Horizontal"
                Width="130" Height="60" VerticalAlignment="Center" >
                <TextBlock Margin="2,0,0,0" TextWrapping="Wrap"
                    Style="{StaticResource ItemSubtitleStyle}"
                    VerticalAlignment="Center"
                    HorizontalAlignment="Left"
                    Text="{Binding startTime}" Width="70" />
                <TextBlock TextWrapping="Wrap"
                    Style="{StaticResource ItemTitleStyle}"
                    VerticalAlignment="Center"
                    HorizontalAlignment="Right"
                    Text="{Binding startHole}" Width="40" />
            </StackPanel>
        </Border>
    </Grid>
</DataTemplate>

...そして、以下をレンダリングします:

マージン/パディング付きの ListView

4

5 に答える 5

8

負の値を指定する必要がありますMargin:

<ListView.ItemContainerStyle>
   <Style TargetType="ListViewItem">
      <Setter Property="HorizontalContentAlignment" Value="Left" />
      <Setter Property="VerticalContentAlignment" Value="Center" />
      <Setter Property="Margin" Value="0,0,0,-8" />
   </Style>
</ListView.ItemContainerStyle>
于 2012-08-30T06:51:03.090 に答える
6

1時間の検索の後。負のマージンよりもはるかに優れたソリューションを次に示します。

以下は、あなたが望むマージンを持つことを可能にするコードです! (ここでは: 0)

<Style x:Key="ListViewItemStyle1" TargetType="ListViewItem">
   <Setter Property="Template">
      <Setter.Value>
         <ControlTemplate TargetType="ListViewItem">
            <ListViewItemPresenter ContentMargin="0" />
          </ControlTemplate>
      </Setter.Value>
    </Setter>            
</Style>

...

<ListView ItemContainerStyle="{StaticResource ListViewItemStyle1}">
 //your listView items
</ListView>
于 2014-07-16T09:39:13.860 に答える
5

私はすでにこの問題のかなり明確な解決策を見つけました!

<Style x:Key="NoSpacesListViewItemStyle" TargetType="ListViewItem">
    <Setter Property="Margin" Value="0"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ListViewItem">
                <ListViewItemPresenter ContentMargin="0" SelectionCheckMarkVisualEnabled="False" />
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

<ListView     IsSwipeEnabled="False"
              ItemContainerStyle="{StaticResource NoSpacesListViewItemStyle}"
              ItemTemplate="{StaticResource SomeTemplate}"
              ItemsSource="{Binding SomeData}"
              SelectionMode="None"/>

また、この場合、選択境界線が機能しないことも認めます。そのため、このメソッドは選択のある ListViews には適していません。

同じ変更を加えた完全なデフォルトの ListViewItemStyle があります。

<Style x:Key="NoSpacesListViewItemStyle" TargetType="ListViewItem">
    <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" />
    <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}" />
    <Setter Property="Background" Value="Transparent" />
    <Setter Property="TabNavigation" Value="Local" />
    <Setter Property="IsHoldingEnabled" Value="True" />
    <Setter Property="Margin" Value="0" />
    <Setter Property="HorizontalContentAlignment" Value="Left" />
    <Setter Property="VerticalContentAlignment" Value="Top" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ListViewItem">
                <ListViewItemPresenter HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                                       VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
                                       CheckBrush="{ThemeResource ListViewItemCheckThemeBrush}"
                                       CheckHintBrush="{ThemeResource ListViewItemCheckHintThemeBrush}"
                                       CheckSelectingBrush="{ThemeResource ListViewItemCheckSelectingThemeBrush}"
                                       ContentMargin="0"
                                       ContentTransitions="{TemplateBinding ContentTransitions}"
                                       DisabledOpacity="{ThemeResource ListViewItemDisabledThemeOpacity}"
                                       DragBackground="{ThemeResource ListViewItemDragBackgroundThemeBrush}"
                                       DragForeground="{ThemeResource ListViewItemDragForegroundThemeBrush}"
                                       DragOpacity="{ThemeResource ListViewItemDragThemeOpacity}"
                                       FocusBorderBrush="{ThemeResource ListViewItemFocusBorderThemeBrush}"
                                       Padding="{TemplateBinding Padding}"
                                       PlaceholderBackground="{ThemeResource ListViewItemPlaceholderBackgroundThemeBrush}"
                                       PointerOverBackground="{ThemeResource ListViewItemPointerOverBackgroundThemeBrush}"
                                       PointerOverBackgroundMargin="1"
                                       ReorderHintOffset="{ThemeResource ListViewItemReorderHintThemeOffset}"
                                       SelectedBackground="{ThemeResource ListViewItemSelectedBackgroundThemeBrush}"
                                       SelectedBorderThickness="{ThemeResource ListViewItemCompactSelectedBorderThemeThickness}"
                                       SelectedForeground="{ThemeResource ListViewItemSelectedForegroundThemeBrush}"
                                       SelectedPointerOverBackground="{ThemeResource ListViewItemSelectedPointerOverBackgroundThemeBrush}"
                                       SelectedPointerOverBorderBrush="{ThemeResource ListViewItemSelectedPointerOverBorderThemeBrush}"
                                       SelectionCheckMarkVisualEnabled="False" />
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>
于 2014-09-22T21:37:55.910 に答える
1

はい、ListViewItem コントロールのテンプレートに 4px のマージンがあります (ContentBorder要素を見てください):

<Border x:Name="OuterContainer">
    <!-- Visual States -->
    <Grid x:Name="ReorderHintContent" Background="Transparent">
        <Path x:Name="SelectingGlyph" Data="F1 M133.1,17.9 L137.2,13.2 L144.6,19.6 L156.4,5.8 L161.2,9.9 L145.6,28.4 z" Fill="{StaticResource ListViewItemCheckSelectingThemeBrush}" FlowDirection="LeftToRight" HorizontalAlignment="Right" Height="13" Margin="0,9.5,9.5,0" Opacity="0" Stretch="Fill" VerticalAlignment="Top" Width="15"/>
        <Border x:Name="HintGlyphBorder" HorizontalAlignment="Right" Height="40" Margin="4" Opacity="0" VerticalAlignment="Top" Width="40">
            <Path x:Name="HintGlyph" Data="F1 M133.1,17.9 L137.2,13.2 L144.6,19.6 L156.4,5.8 L161.2,9.9 L145.6,28.4 z" Fill="{StaticResource ListViewItemCheckHintThemeBrush}" FlowDirection="LeftToRight" HorizontalAlignment="Right" Height="13" Margin="0,5.5,5.5,0" Opacity="0" Stretch="Fill" VerticalAlignment="Top" Width="15"/>
        </Border>
        <Border x:Name="ContentContainer">
            <Grid x:Name="InnerDragContent">
                <Rectangle x:Name="PointerOverBorder" Fill="{StaticResource ListViewItemPointerOverBackgroundThemeBrush}" IsHitTestVisible="False" Margin="1" Opacity="0"/>
                <Rectangle x:Name="FocusVisual" IsHitTestVisible="False" Opacity="0" Stroke="{StaticResource ListViewItemFocusBorderThemeBrush}" StrokeThickness="2"/>
                <Rectangle x:Name="SelectionBackground" Fill="{StaticResource ListViewItemSelectedBackgroundThemeBrush}" Margin="4" Opacity="0"/>
                <Border x:Name="ContentBorder" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Margin="4">
                    <Grid>
                        <ContentPresenter x:Name="contentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" ContentTransitions="{TemplateBinding ContentTransitions}" Content="{TemplateBinding Content}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                        <TextBlock x:Name="PlaceholderTextBlock" Foreground="{x:Null}" IsHitTestVisible="False" Margin="{TemplateBinding Padding}" Opacity="0" Text="Xg"/>
                        <Rectangle x:Name="PlaceholderRect" Fill="{StaticResource ListViewItemPlaceholderBackgroundThemeBrush}" IsHitTestVisible="False" Visibility="Collapsed"/>
                        <Rectangle x:Name="MultiArrangeOverlayBackground" Fill="{StaticResource ListViewItemDragBackgroundThemeBrush}" IsHitTestVisible="False" Opacity="0"/>
                    </Grid>
                </Border>
                <Rectangle x:Name="SelectedBorder" IsHitTestVisible="False" Margin="4" Opacity="0" Stroke="{StaticResource ListViewItemSelectedBackgroundThemeBrush}" StrokeThickness="{StaticResource ListViewItemSelectedBorderThemeThickness}"/>
                <Border x:Name="SelectedCheckMarkOuter" HorizontalAlignment="Right" IsHitTestVisible="False" Margin="4" VerticalAlignment="Top">
                    <Grid x:Name="SelectedCheckMark" Height="40" Opacity="0" Width="40">
                        <Path x:Name="SelectedEarmark" Data="M0,0 L40,0 L40,40 z" Fill="{StaticResource ListViewItemSelectedBackgroundThemeBrush}" Stretch="Fill"/>
                        <Path Data="F1 M133.1,17.9 L137.2,13.2 L144.6,19.6 L156.4,5.8 L161.2,9.9 L145.6,28.4 z" Fill="{StaticResource ListViewItemCheckThemeBrush}" FlowDirection="LeftToRight" HorizontalAlignment="Right" Height="13" Margin="0,5.5,5.5,0" Stretch="Fill" VerticalAlignment="Top" Width="15"/>
                    </Grid>
                </Border>
                <TextBlock x:Name="MultiArrangeOverlayText" Foreground="{StaticResource ListViewItemDragForegroundThemeBrush}" FontSize="26.667" FontFamily="{StaticResource ContentControlThemeFontFamily}" IsHitTestVisible="False" Margin="18,9,0,0" Opacity="0" TextWrapping="Wrap" Text="{Binding TemplateSettings.DragItemsCount, RelativeSource={RelativeSource Mode=TemplatedParent}}" TextTrimming="WordEllipsis"/>
            </Grid>
        </Border>
    </Grid>
</Border>

このテンプレート編集を使用して、これらのマージンを簡単にオーバーライドできます。ListViewEditItem を選択し、Edit Style->Edit a Copy...アクションを実行します。

于 2012-08-29T04:35:01.530 に答える
0

編集: どうやらそれは ListView テンプレート内にあります。VS2012 RTM に付属の Blend 2012 で編集します。

Blend に移動し、テンプレート コピーを作成してから、VS2012 XAML 内の xaml に移動します。上部にある Margin に移動し、それらをすべて 0 に設定します。

于 2012-08-29T04:23:10.253 に答える