2014-02-26 35 views
1

我有一个TabControl与两个TabItems,它在Visual Studio 2013中的视觉设计器中看起来无缝 - 但是当我运行我的解决方案时创建了一个边框并且我似乎无法摆脱它。在图像中,它看起来像是围绕网格,但它是标签标题和关注我的标签内容之间的边界。背景瓦特。不透明度给不需要的边框

如果我从背景替换透明度,而使用纯色,问题就会消失。看起来它与半透明度有关。

在可视化设计,它看起来像这样:

Visual Designer

而结果当我建立并运行:

Build and Run

的代码是有点向前伸直,将所有了borderThickness到0

<Window> 
    <Window.Resources> 
     <SolidColorBrush x:Key="HasSelectedBrush" Color="White" Opacity="0.65" /> 
     <SolidColorBrush x:Key="NoSelectedBrush" Color="White" Opacity="0.5" /> 

     <Style TargetType="{x:Type TabControl}"> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="{x:Type TabControl}"> 
         <StackPanel> 
          <TabPanel x:Name="HeaderPanel" Panel.ZIndex="1" Margin="0" IsItemsHost="True" KeyboardNavigation.TabIndex="1" Background="Transparent" /> 
          <Border x:Name="Border" BorderBrush="Transparent" BorderThickness="0" Margin="0" KeyboardNavigation.TabIndex="2" Background="Transparent"> 
           <ContentPresenter ClipToBounds="True" Margin="0" ContentSource="SelectedContent" /> 
          </Border> 
         </StackPanel> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 
     <Style TargetType="{x:Type TabItem}"> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="{x:Type TabItem}"> 
          <Border x:Name="Border" Margin="0" Background="{ StaticResource NoSelectedBrush }" BorderThickness="0"> 
           <ContentPresenter x:Name="ContentSite" VerticalAlignment="Center" HorizontalAlignment="Center" ContentSource="Header" Margin="0, 20, 0, 20" /> 
          </Border> 
         <ControlTemplate.Triggers> 
          <Trigger Property="IsSelected" Value="True"> 
           <Setter Property="Panel.ZIndex" Value="100" /> 
           <Setter TargetName="Border" Property="Background" Value="{ StaticResource HasSelectedBrush }" /> 
          </Trigger> 
         </ControlTemplate.Triggers> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 
    </Window.Resources> 
    <Grid> 
     <Grid x:Name="MainViewGrid"> 
      <Grid.Background> 
       <ImageBrush Stretch="Fill" ImageSource="Assets/Images/Background.jpg" /> 
      </Grid.Background> 
      <TabControl Width="500" Height="400" Margin="0" Padding="0" Background="Transparent"> 
       <TabItem Header="Tab One" Width="250"> 
        <controls:FirstTabControl /> 
       </TabItem> 
       <TabItem Header="Tab Two" Width="250"> 
        <controls:SecondTabControl /> 
       </TabItem> 
      </TabControl> 
     </Grid> 
    </Grid> 
</Window> 

更新

一些更多的测试之后,我的结论是,这取决于窗口大小。似乎边界来自反走样,但设置SnapsToDevicePixels为真并不能解决我的问题。

+2

我建议运行Snoop(http://snoopwpf.codeplex.com/)来分析这类问题。 –

+0

您是否检查过ItemContainerStyle模板。在Blend中,右键单击TabControl,编辑其他模板,编辑ItemContainerStyle的副本? – SWilko

+0

@modosansreves - 感谢,好看的工具! –

回答

0

没有答案,只是一个问题的完善。

继问题之后,我做了很多实验,并且发现了另一个有趣的事实。

当它在TabControl中时,堆叠面板没有连续放置Childs!

下面是一个例子。在此代码

鉴于此代码:

<Grid Background="Black" Width="150"> 
    <StackPanel> 
     <Border Background="White" Height="50" /> 
     <Border Background="White" Height="50" /> 
     <Border Background="White" Height="50" /> 
    </StackPanel> 
</Grid> 

结果:

enter image description here

但在TabControl的,如:

<TabControl Background="Black" Width="150" > 
     <TabItem Header="Tab" > 
      <StackPanel> 
       <Border Background="White" Height="50" /> 
       <Border Background="White" Height="50" /> 
       <Border Background="White" Height="50" /> 
      </StackPanel> 
     </TabItem> 
    </TabControl> 

enter image description here

为什么在Borders上有线路?

+0

我不能重现那种行为(WPF .Net4.5 W8.1)我成为唯一的“边界”是从黑色背景,但不是这条灰线 – WiiMaxx

+0

有趣。我的machin(Win7)在设计时没有出现,但在运行时出现如图。 – dovid

+0

mhh也许它是一个边框的baseStyle事情 – WiiMaxx