2016-04-26 6 views
0

При масштабировании элемента ItemsControl с элементами, которые помещаются в сетку через слайдер, я получаю промежутки между элементами в каждом положении зума. Пожалуйста, обратитесь к моему приведенному ниже коду.Пространство между элементами в 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, где оба «кровоточить» в белом пространстве, в результате белой линии. Такое поведение часто вызывается масштабированием, поскольку оно пытается сжать вещи на меньшее количество пикселей.

Попробуйте установить SnapToDevicePixels=true на ваши граничные/фоновые объекты (или родительский элемент ItemsControl, я думаю, что он стекает).

Смотрите здесь: https://msdn.microsoft.com/en-us/library/aa970908(v=vs.85).aspx

+0

Спасибо за ваш ответ, я пытался ваше решение, но по-прежнему сталкивается с проблемой. Я попытался установить SnapsToDevicePixels в true для ItemsControl, а также в стеке внутри ItemsPanelITemplate. Но бесполезно. Тем не менее я получаю эту проблему. Не могли бы вы мне помочь.. –