2016-11-07 2 views
0

내 uwp 앱에서 배경 "이미지"로 사용하는 Canvas/RelativePanel이 있습니다.캔버스 하단 누락 uwp

아이를 아래쪽 캔버스에 배치하려면 어떻게해야합니까? wpf와 같은 캔버스가 없습니다. 상대 패널에서 아이를 상대 패널의 맨 아래에 위치 시키려면 적절한 부속 속성을 찾지 못했습니다.

 <RelativePanel> 
      <ContentControl ContentTemplate="{StaticResource AsterioidTemplate}" /> 
      <Canvas x:Name="mountain_to_bottom" HorizontalAlignment="Stretch" VerticalAlignment="Bottom"> 
       <Path Width="126.389" Height="326.227" Canvas.Left="272.433" Canvas.Top="28.3291" Stretch="Fill" StrokeThickness="1.33333" StrokeLineJoin="Round" Stroke="#FF23232D" Fill="#FF23232D" Data="F1 M 398.155,353.889L 273.099,186.024L 315.298,28.9958L 398.155,353.889 Z "/> 
      </Canvas> 
     </RelativePanel> 

답변

0

어떻게 바닥에 캔버스에 아이를 배치 할 수 있습니다?

Canvas

는 x 및 y coordinates.Since 캔버스 절대 지정하여 캔버스 내부 요소의 위치를 ​​제어 uwp.You에서 캔버스의 왼쪽 상단 모서리에 대해 자식 요소의 절대 위치를 지원하는 배치 패널 인 위치 지정에서 자식 내용은 패널 경계에 의해 제약받지 않으므로 캔버스의 맨 아래에 자식을 직접 정의하지 않을 수 있습니다. 그러나 캔버스의 맨 아래에 자식을 배치 할 수 있도록 위치를 수동으로 계산할 수 있습니다. 예를 들어, 다음 데모는 캔버스 하단에 이미지를 표시 할 수 있습니다. 나는 또한 상대 패널의 아래쪽에있는 아이를 배치합니다 relativepanel에있는 적절한 연결된 속성을 찾을 수 없습니다

private void btnbottom_Click(object sender, RoutedEventArgs e) 
    { 
     double canvasheight = mountain_to_bottom.ActualHeight; 
     if (pathelement.ActualHeight < canvasheight) 
     { 
      double top = canvasheight - pathelement.ActualHeight; 
      pathelement.SetValue(Canvas.TopProperty, top); 
     } 
    } 

뒤에

XAML 코드

<Canvas Background="Pink" x:Name="mountain_to_bottom" Height="600"> 
    <Path x:Name="pathelement" Width="126.389" Height="326.227" VerticalAlignment="Bottom" Stretch="Fill" StrokeThickness="1.33333" StrokeLineJoin="Round" Stroke="#FF23232D" Fill="#FF23232D" Data="F1 M 398.155,353.889L 273.099,186.024L 315.298,28.9958L 398.155,353.889 Z "/> 
</Canvas> 
<Button x:Name="btnbottom" Click="btnbottom_Click" Content="to bottom"></Button> 

코드입니다.

내부는 relative panel이며, 요소는 다양한 부착 속성을 사용하여 배치됩니다. 상대 패널은 하위 패널의 하위 위치에 대해 부착 된 속성 인 RelativePanel.AlignBottomWithPanel을 제공합니다.

<RelativePanel BorderBrush="Gray" BorderThickness="10"> 
    <Path x:Name="pathelement" RelativePanel.AlignBottomWithPanel="True" Width="126.389" Height="326.227" VerticalAlignment="Bottom" Stretch="Fill" StrokeThickness="1.33333" StrokeLineJoin="Round" Stroke="#FF23232D" Fill="#FF23232D" Data="F1 M 398.155,353.889L 273.099,186.024L 315.298,28.9958L 398.155,353.889 Z "/> 
</RelativePanel> 

캔버스와 관련 패널이 요구 사항을 잘 충족시키지 못하면 다른 컨테이너에 대해 고려할 수 있습니다. 사용할 컨테이너는 레이아웃에 따라 다릅니다. 예를 들어, relativePanel은 명확한 선형 패턴이없는 UI를 만드는 데 유용한 레이아웃 컨테이너입니다. 즉 기본적으로 스택, 랩 또는 테이블 형식이 아닌 레이아웃을 사용하여 자연스럽게 스택 패널 또는 그리드를 사용할 수 있습니다. 자세한 내용은 Layout panels을 참조하십시오.