2017-02-15 13 views
3

私はこの一見単純なシナリオを動作させようとしています。 私はContentControl MyControlを持っています。その要素の1つがContentPresenterの上にオーバーフローし、ボーダーの要素のまま残りたいと思います。ContentControlのContentPresenterオーバーレイ要素

enter image description here

<Page 
    x:Class="Playground.MainPage" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:local="using:Playground" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    xmlns:controls="using:Playground" 
    mc:Ignorable="d" 
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> 

    <Page.Resources> 
     <Style TargetType="local:MyControl" > 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="local:MyControl"> 
         <Grid> 
          <Grid.RowDefinitions> 
           <RowDefinition Height="100"/> 
           <RowDefinition Height="*"/> 
          </Grid.RowDefinitions> 

          <Border Grid.Row="0" BorderBrush="GreenYellow" BorderThickness="1"> 
           <Grid> 
            <Grid.ColumnDefinitions> 
             <ColumnDefinition Width="*"/> 
             <ColumnDefinition Width="2*"/> 
             <ColumnDefinition Width="*"/> 
            </Grid.ColumnDefinitions> 
            <Rectangle Grid.Column="0" Width="50" Height="50" Fill="Silver" HorizontalAlignment="Center"/> 
            <Rectangle x:Name="Overflow" Grid.Column="1" Width="100" Height="200" Fill="Gold" HorizontalAlignment="Center"/> 
            <Rectangle Grid.Column="2" Width="50" Height="50" Fill="Silver" HorizontalAlignment="Center"/> 
           </Grid> 
          </Border> 

          <ContentPresenter Grid.Row="1"/> 
         </Grid> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 
    </Page.Resources> 

    <controls:MyControl Grid.Row="0" BorderBrush="Gold" BorderThickness="1"> 
     <Ellipse Fill="Silver"/> 
    </controls:MyControl> 
</Page> 

私はCanvas.ZIndexで遊んで試してみましたが、私はこの特定のシナリオを動作させることはできません。これを繰り返すだけで、ContentPresenterのすべてのコンテンツに金色の長方形があふれていきたいと思いますが、境界線と2つの四角形をそのまま残しておきたいと思います。

編集:誰かがこのプロジェクトに興味があれば、このプロジェクトのソースはhereです。

答えて

1

だから、真ん中の長方形があなたの国境の一部になりたいが、それは国境の境界の外に行くべき?

このため、マイナスの余白のみを使用できます。

コンテンツをオーバーレイするには、枠線を親グリッドの2番目の子にする必要があります。

<Style TargetType="local:MyControl"> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="local:MyControl"> 
       <Grid> 
        <Grid.RowDefinitions> 
         <RowDefinition Height="100" /> 
         <RowDefinition Height="*" /> 
        </Grid.RowDefinitions> 

        <ContentPresenter Grid.Row="1" /> 

        <Border 
         Grid.Row="0" 
         BorderBrush="GreenYellow" 
         BorderThickness="1"> 
         <Grid> 
           <Grid.ColumnDefinitions> 
            <ColumnDefinition Width="*" /> 
            <ColumnDefinition Width="2*" /> 
            <ColumnDefinition Width="*" /> 
           </Grid.ColumnDefinitions> 
           <Rectangle 
            Grid.Column="0" 
            Width="50" 
            Height="50" 
            HorizontalAlignment="Center" 
            Fill="Silver" /> 
           <!--Pay attention to Margin="0,0,0,-100"--> 
           <Rectangle 
            x:Name="Overflow" 
            Grid.Column="1" 
            Width="100" 
            Height="200" 
            Margin="0,0,0,-100" 
            HorizontalAlignment="Center" 
            Fill="Gold" /> 
           <Rectangle 
            Grid.Column="2" 
            Width="50" 
            Height="50" 
            HorizontalAlignment="Center" 
            Fill="Silver" /> 
         </Grid> 
        </Border>       
       </Grid> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 
:我々は持っているeverithingをsumarizing

0

ハッキーの回避策私は思いつきました - 問題は、矩形がもはやボーダーの一部ではなく、ボーダーに関して容易に配置できないことです。

Result

<Page 
    x:Class="Playground.MainPage" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:local="using:Playground" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    xmlns:controls="using:Playground" 
    mc:Ignorable="d" 
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> 

    <Page.Resources> 
     <Style TargetType="local:MyControl" > 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="local:MyControl"> 
         <Grid> 
          <Grid.RowDefinitions> 
           <RowDefinition Height="100"/> 
           <RowDefinition Height="*"/> 
          </Grid.RowDefinitions> 

          <ContentPresenter Grid.Row="1"/> 

          <Border Grid.Row="0" BorderBrush="GreenYellow" BorderThickness="1"> 
           <Grid> 
            <Grid.ColumnDefinitions> 
             <ColumnDefinition Width="*"/> 
             <ColumnDefinition Width="2*"/> 
             <ColumnDefinition Width="*"/> 
            </Grid.ColumnDefinitions> 
            <Rectangle Grid.Column="0" Width="50" Height="50" Fill="Silver" HorizontalAlignment="Center"/> 
            <Rectangle Grid.Column="2" Width="50" Height="50" Fill="Silver" HorizontalAlignment="Center"/> 
           </Grid> 
          </Border> 

          <Rectangle Grid.Row="0" Grid.RowSpan="2" x:Name="Overflow" Grid.Column="1" Width="100" Height="200" Fill="Gold" HorizontalAlignment="Center" VerticalAlignment="Top"/> 
         </Grid> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 
    </Page.Resources> 

    <controls:MyControl Grid.Row="0" BorderBrush="Gold" BorderThickness="1"> 
     <Ellipse Fill="Silver"/> 
    </controls:MyControl> 
</Page> 
関連する問題