2016-04-26 8 views
0

スライダを介してグリッドに配置されたアイテムでItemsControlをズームしているとき、各ズーム位置でアイテム間にギャップがあります。私の下のコードを参照してください。Sliderを使用してズームしているときに、ItemsControl内のアイテム間の間隔が望ましくなく発生しました

MainWindow.xaml:

<Window x:Class="WpfApplication2.MainWindow" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    Title="MainWindow" Height="350" Width="525"> 
<Grid> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="30"></RowDefinition> 
     <RowDefinition Height="*"></RowDefinition> 
    </Grid.RowDefinitions> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="*"></ColumnDefinition> 
    </Grid.ColumnDefinitions> 

    <ToolBar Grid.Row="0" Grid.Column="0" VerticalAlignment="Top" FlowDirection="LeftToRight"> 


     <Slider Name="slider1" 
     Grid.Row="1" 
     Maximum="2" 
     Minimum=".15" 
     IsMoveToPointEnabled="True" 
     TickPlacement="BottomRight" 
     TickFrequency="2" 
     Ticks=".15,.30,.45,.60,.75,1,1.15,1.30,1.45,1.60,1.75,2" 
     Width="200" 
     Margin="0" 
     HorizontalAlignment="Right" 
     SelectionStart="1" IsSnapToTickEnabled="True"/> 

    </ToolBar> 

    <Grid Name="grid" Grid.Column="0" Grid.Row="1" 
       VerticalAlignment="Center" HorizontalAlignment="Center"> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="*"></ColumnDefinition> 
      <ColumnDefinition Width="Auto"></ColumnDefinition> 
     </Grid.ColumnDefinitions> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="*"></RowDefinition> 
      <RowDefinition Height="Auto"></RowDefinition> 
     </Grid.RowDefinitions> 
     <Grid.LayoutTransform> 
      <TransformGroup> 
       <ScaleTransform x:Name="scaleTransform" 
             ScaleX="{Binding Path=Value, ElementName=slider1}" 
             ScaleY="{Binding Path=Value, ElementName=slider1}" /> 

      </TransformGroup> 

     </Grid.LayoutTransform> 


     <ItemsControl Name="TabItems" 
          ItemsSource="{Binding Path=TabPreviewParamsList}" > 
      <ItemsControl.ItemsPanel> 
       <ItemsPanelTemplate> 

        <StackPanel Orientation="Vertical" Width="140"> 
        </StackPanel> 
       </ItemsPanelTemplate> 
      </ItemsControl.ItemsPanel> 
      <ItemsControl.ItemTemplate> 
       <DataTemplate> 
        <DockPanel Height= "60" ClipToBounds="True" Background="Red" Margin="0,0,0,0"> 

         <Border ClipToBounds="True" BorderThickness="0" BorderBrush="Black" Height="60"> 
          <TextBlock Text="Sample" > 
           <TextBlock.LayoutTransform> 
            <RotateTransform Angle="90"/> 
           </TextBlock.LayoutTransform> 
          </TextBlock> 
         </Border> 

        </DockPanel> 
       </DataTemplate> 
      </ItemsControl.ItemTemplate> 
      <ItemsControl.LayoutTransform> 
       <RotateTransform Angle="{Binding Path=TabOrientationAngle}"/> 
      </ItemsControl.LayoutTransform> 
     </ItemsControl> 

    </Grid> 
</Grid> 

MainWindow.xaml.cs

/// <summary> 
/// Interaction logic for MainWindow.xaml 
/// </summary> 
public partial class MainWindow : Window 
{ 
    public MainWindow() 
    { 
     InitializeComponent(); 
     this.TabItems.Items.Add(1); 
     this.TabItems.Items.Add(1); 
     this.TabItems.Items.Add(1); 
     this.TabItems.Items.Add(1); 
     this.TabItems.Items.Add(1); 
    } 
} 

上記のコードを使用してアプリケーションを実行し、スライダをドラッグしている間、アイテム間の若干のズレが発生しています商品間の白の境界線のように見えます。画像の下に参照してください:

ItemsControlBorder

親切に私はズームしながら、ItemsControlに内の項目間のギャップを避けるために、解決策を教えてください。

おかげで、

答えて

0

これは両方が白線を生じる空白に「ブリード」WPF、画素は、丸めの結果であり得ます。この種の振る舞いは、ズームすることによってしばしば暴露されます。

ボーダー/バックグラウンドアイテム(または親ItemsControl、私はそれが流れ落ちると思う)にSnapToDevicePixels=trueを設定してみてください。

はこちらを参照してください:あなたの返信用https://msdn.microsoft.com/en-us/library/aa970908(v=vs.85).aspx

+0

おかげで、私はあなたのソリューションを試してみましたが、それでも問題に直面しています。 ItemsPanelITemplate内のStackPanelだけでなく、ItemsControlに対してSnapsToDevicePixelsをtrueに設定しようとしました。しかし、使用しないでください。それでも私は問題を抱えています。手伝ってくれませんか.. –