当前位置:网站首页 / WPF / 正文

【ay wpf markup】AY XAML应该这样玩-写个复杂的绘图【12/18】

时间:2016年07月22日 | 作者 : aaronyang | 分类 : WPF | 浏览: 1913次 | 评论 0

    <Grid Name="LayoutRoot">
        <Grid.Resources>
            <p:ResourceObject x:Key="ViewModel">
                <p:Property PropertyName="ControlPoints">
                    <p:Collection>
                        <p:Path>[] { X = 50., Y = 50. }</p:Path>
                        <p:Path>[] { X = 100., Y = 100. }</p:Path>
                        <p:Path>[] { X = 50., Y = 150. }</p:Path>
                    </p:Collection>
                </p:Property>
                <p:Property PropertyName="Segments">
                    <p:Collection>
                        <p:Path>[] { Start = @this.ControlPoints[0], End = @this.ControlPoints[1] }</p:Path>
                        <p:Path>[] { Start = @this.ControlPoints[1], End = @this.ControlPoints[2] }</p:Path>
                    </p:Collection>
                </p:Property>
            </p:ResourceObject>
        </Grid.Resources>
        <Grid.DataContext>
            <Binding Path="Value" Source="{StaticResource ViewModel}"/>
        </Grid.DataContext>
        <Grid.Background>
            <DrawingBrush x:Name="GridBrush" Viewport="0,0,10,10" ViewportUnits="Absolute" TileMode="Tile">
                <DrawingBrush.Drawing>
                    <DrawingGroup>
                        <GeometryDrawing Brush="#CCCCFF">
                            <GeometryDrawing.Geometry>
                                <RectangleGeometry Rect="0,0 10,1"/>
                            </GeometryDrawing.Geometry>
                        </GeometryDrawing>
                        <GeometryDrawing Brush="#CCCCFF">
                            <GeometryDrawing.Geometry>
                                <RectangleGeometry Rect="0,0 1,10"/>
                            </GeometryDrawing.Geometry>
                        </GeometryDrawing>
                    </DrawingGroup>
                </DrawingBrush.Drawing>
            </DrawingBrush>
        </Grid.Background>
        <ItemsControl ItemsSource="{Binding Segments}">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <Canvas/>
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <Line X1="{Binding Start.X}" Y1="{Binding Start.Y}"
                          X2="{Binding End.X}" Y2="{Binding End.Y}"
                          Stroke="Black" StrokeThickness="2"/>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>
        <ItemsControl ItemsSource="{Binding ControlPoints}">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <Canvas/>
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
            <ItemsControl.ItemContainerStyle>
                <Style TargetType="ContentPresenter">
                    <Setter Property="Canvas.Left" Value="{Binding X}"/>
                    <Setter Property="Canvas.Top" Value="{Binding Y}"/>
                </Style>
            </ItemsControl.ItemContainerStyle>
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <Ellipse Margin="-10,-10,0,0" Width="20" Height="20"
                             Stroke="DarkBlue" Fill="Transparent">
                        <p:Attached.Operations>
                            <p:CallHandler Path="MouseLeftButtonDown => @AssociatedObject.CaptureMouse()"/>
                            <p:CallHandler Path="MouseLeftButtonUp => @AssociatedObject.ReleaseMouseCapture()"/>
                            <p:ScriptHandler Path="MouseMove">
                                if (@EventArgs.LeftButton != [MouseButtonState].Pressed) return;
                                var $mouse = @EventArgs.GetPosition(@FindElement("LayoutRoot"));
                                X = $mouse.X; Y = $mouse.Y;
                            </p:ScriptHandler>
                        </p:Attached.Operations>
                    </Ellipse>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>
    </Grid>


效果图:

3.gif


知识点:重复的DrawingBrush写法,可以制造出 透明背景颜色的 背景图

ItemsControls

CallHandler和ScriptHandler混用



====================www.ayjs.net       杨洋    wpfui.com        ayui      ay  aaronyang=======请不要转载谢谢了。=========







推荐您阅读更多有关于“WPF4.5,”的文章

猜你喜欢

额 本文暂时没人评论 来添加一个吧

发表评论

必填

选填

选填

必填

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

  查看权限

抖音:wpfui 工作wpf

目前在合肥企迈科技公司上班,加我QQ私聊

2023年11月网站停运,将搬到CSDN上

AYUI8全源码 Github地址:前往获取

杨洋(AaronYang简称AY,安徽六安人)AY唯一QQ:875556003和AY交流

高中学历,2010年开始web开发,2015年1月17日开始学习WPF

声明:AYUI7个人与商用免费,源码可购买。部分DEMO不免费

查看捐赠

AYUI7.X MVC教程 更新如下:

第一课 第二课 程序加密教程

标签列表