c＃uwpユーザーコントロールのカット

Question

いくつかのコントロールがビューの外にあるユーザーコントロールを作成しましたが、アニメーションが表示されるとすぐに表示されます。アニメーションはオフセットを変更しているので、ゆっくりと表示されます。今、私はいくつかのビューに私のusercontrolを入れて、 私が見たくないそれらのコントロールが表示されます。私はグリッド、グリッドビュー、キャンバスの使用に結びついていましたが、毎回これらのコントロールを見ることができます。

私は自分のusercontrolsの行をresizebleする必要があります。そして、この問題は、いくつかのユーザーコントロールがお互いに重なり合うようにします。ここで

は、私は、グリッドに表示している方法です。

<Grid x:Name="gridDown" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"> 

     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="25*" /> 
      <ColumnDefinition Width="25*" /> 
      <ColumnDefinition Width="25*" /> 
      <ColumnDefinition Width="25*" /> 
     </Grid.ColumnDefinitions> 

     <local:MyUserControl x:Name="myControl1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Column="0"/> 
     <local:MyUserControl x:Name="myControl2" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Column="1"/> 
     <local:MyUserControl x:Name="myControl3" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Column="2"/> 
     <local:MyUserControl x:Name="myControl4" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Column="3"/> 

</Grid> 

私のUserControlの中央部分のみを表示する方法は？私が見たくない残りのコントロールを隠すには？これにはどんなコントロールが最適ですか？

Answer 1

表示内容を制御するには、表示する範囲を設定する場所を指定する必要があります。 WPFでは有用なClipToBounds propertyがありますが、残念ながらこれはUWPでは利用できませんので、あなた自身で 'Clip'プロパティを設定する必要があります。だから、

、あなたのページが、この

<StackPanel HorizontalAlignment="Center" VerticalAlignment="Center"> 
    <local:MyControl/> 
    <local:MyControl/> 
    <local:MyControl/> 
</StackPanel> 

のように見えたそして、あなたのコントロールのXAMLは、あなたは私が手動で設定していることがわかります。この

<Grid Height="50" Width="100"> 
    <Grid.Clip> 
     <RectangleGeometry Rect="0 0 100 50"/> 
    </Grid.Clip> 
    <Grid.Resources> 
     <Storyboard x:Name="ShowRedBit"> 
      <DoubleAnimation Storyboard.TargetProperty="Rectangle.RenderTransform.(CompositeTransform.TranslateX)" 
          Storyboard.TargetName="RedBit" 
          Duration="0:0:2" 
        To="0"/> 
     </Storyboard> 
    </Grid.Resources> 
    <Button HorizontalAlignment="Center" Click="Button_Click">show red</Button> 
    <Rectangle Fill="Red" Height="50" Width="50" x:Name="RedBit" RenderTransformOrigin="0.5,0.5" > 
     <Rectangle.RenderTransform> 
      <CompositeTransform TranslateX="-100"/> 
     </Rectangle.RenderTransform> 
    </Rectangle> 
</Grid> 

ように見えた場合clipプロパティはコントロールのサイズと同じになります。

this questionの回答には、動的に設定する方法も含まれています。