C# 如何在UWP中调整画布的大小
我有一个扩展画布的视图。 这样的视图位于另一个画布中C# 如何在UWP中调整画布的大小,c#,canvas,uwp,resize,runtime,C#,Canvas,Uwp,Resize,Runtime,我有一个扩展画布的视图。 这样的视图位于另一个画布中 public class MyView : Canvas { //this is my view } protected override void OnNavigatedTo(NavigationEventArgs e) { PointerEventManager manager = new PointerEventManager(); // utility to manage the resizing event... My
public class MyView : Canvas
{
//this is my view
}
protected override void OnNavigatedTo(NavigationEventArgs e)
{
PointerEventManager manager = new PointerEventManager(); // utility to manage the resizing event...
MyView myView = new MyView();
myView.PointerPressed += manager.OnPointerDown;
myView.PointerMoved += manager.OnPointerMoved;
myView.PointerReleased += manager.OnPointerUp;
Canvas parent = new Canvas();
parent.Children.Add(myView);
// other stuff...
}
我希望用户能够调整myView的大小
请注意,这样的视图也应该由用户拖动,这是我希望这样的视图成为画布的主要原因
方法manager.OnPointerMoved
的代码如下所示:
protected void OnPointerMoved(object sender, PointerRoutedEventArgs e)
{
myView.Width = myView.Width + 15; // enlarge by 15 pixel the width
myView.Height = myView.Height + 50; // enlarge by 50 pixel the height
}
更改myView的宽度和高度无效
如何正确调整myView的大小?我发现您的代码有几个问题 首先,您没有设置
MyView
的Background
(您没有提到)。因此,它是空的,因此,它不会捕获任何PointerEvent
。就这样
其次,如果您通过了第一个问题,但是您没有设置MyView
的宽度
和高度
。如果是这种情况,则两条线路都是NaN
,这将阻止这两条线路中的任何一条工作:
myView.Width = myView.Width + 15; // what's NaN + 15 ?
myView.Height = myView.Height + 50; // huh ?
最后,关于
请注意,这样的视图也应该可以由用户拖动,这是
我希望这种视图成为画布的主要原因
好的,您可以利用任何
框架元素的Margin
属性来指定它在父元素布局中的位置。您只需使用中提供的GridSplitter
。
我在网格中放置了一块画布。画布的大小可以通过网格拆分器修改,是的,画布是可拖动的
为了将来谁会碰到这个问题,我使用了一个RelativePanel
而不是画布来管理它。
有了它,我可以移动和拖动更改边距属性,并使用宽度和高度属性调整大小
<Page
x:Class="App1.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:App1"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
xmlns:controls="using:Microsoft.Toolkit.Uwp.UI.Controls"
x:Name="YourPage"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid x:Name="RootGrid"
Margin="48"
BorderThickness="0,0,1,1"
BorderBrush="{ThemeResource SystemControlHighlightChromeHighBrush}"
Height="500"
VerticalAlignment="Top">
<Grid.RowDefinitions >
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"></ColumnDefinition>
<ColumnDefinition Width="Auto"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Canvas Background="Red" CanDrag="True" ></Canvas>
<!--Column Grid Splitter-->
<controls:GridSplitter
GripperCursor="Default"
HorizontalAlignment="Right"
Grid.Column="0"
ResizeDirection="Auto"
ResizeBehavior="BasedOnAlignment"
CursorBehavior="ChangeOnSplitterHover"
Width="16">
<controls:GridSplitter.RenderTransform>
<TranslateTransform X="-8" />
</controls:GridSplitter.RenderTransform>
</controls:GridSplitter>
<!--Row Grid Splitter-->
<controls:GridSplitter
Grid.Row="0"
Grid.ColumnSpan="1"
VerticalAlignment="Bottom"
Height="16">
<controls:GridSplitter.RenderTransform>
<TranslateTransform Y="-8" />
</controls:GridSplitter.RenderTransform>
<controls:GridSplitter.Element>
<Grid>
<TextBlock HorizontalAlignment="Center"
IsHitTestVisible="False"
VerticalAlignment="Center"
Text=""
Foreground="White"
FontFamily="Segoe MDL2 Assets">
</TextBlock>
</Grid>
</controls:GridSplitter.Element>
</controls:GridSplitter>
</Grid>
</Page>