天天看点

使用WPF画横纵坐标图,坐标原点在左下角(2)

首先XAML要做相应的修改:

点击(此处)折叠或打开

Grid.ColumnDefinitions>

            ColumnDefinition Width="1*">/ColumnDefinition>

            ColumnDefinition Width="8*">/ColumnDefinition>

        /Grid.ColumnDefinitions>

        Grid.RowDefinitions>

            RowDefinition Height="26*">/RowDefinition>

            RowDefinition Height="91*">/RowDefinition>

            RowDefinition Height="118*" />

        /Grid.RowDefinitions>

        Label Content="Test(X/Y)" Grid.Column="1" VerticalAlignment="Center" HorizontalAlignment="Center"/>

        Label Content="Y/Y" Grid.Row="2" VerticalAlignment="Center" HorizontalAlignment="Center" Margin="7,80,87,13" Width="156" Grid.ColumnSpan="2">

            Label.RenderTransform>

                RotateTransform Angle="270"/>

            /Label.RenderTransform>

        /Label>

        Label Content="X/X" Grid.Column="1" Grid.Row="3" VerticalAlignment="Center" HorizontalAlignment="Center"/>

        Border Grid.Row="1" Grid.Column="1" BorderBrush="Black" Height="200" Width="200" x:Name="Border1" BorderThickness="1,0,0,1" Margin="11,4" Grid.RowSpan="2">

            Canvas Height="200" Width="200" x:Name="Canvas1">

                Canvas.RenderTransform>

                    TransformGroup>

                        ScaleTransform ScaleY="-1" />

                        TranslateTransform Y="200" />

                    /TransformGroup>

                /Canvas.RenderTransform>

            /Canvas>

        /Border>

    /Grid>

其实就是通过表格来设置X,Y轴的文字描述,还有图的Header描述。注意Label的RenderTransform属性,就是为了让Label旋转。

为了加上刻度,程序代码也要做相应的修改,完整的Page_Load代码如下:

private void Window_Loaded(object sender, RoutedEventArgs e)

        {

            int[] slices = new int[67];

            for (int i = 0; i 67; i++)

            {

                slices[i] = i * 3;

            }

            double[] sens = new double[67];

            sens[0] = 0;

            sens[66] = 0;

            for (int i = 1; i 66; i++)

                if (i % 2 == 0)

                {

                    sens[i] = 119.8 + 20;

                }

                else

                    sens[i] = 119.8 - 20;

            for (int i = 0; i 70; i = i + 5)

                try

                    Label lbl = new Label();

                    lbl.Content = i.ToString();

                    lbl.Measure(new Size(2, 10));

                    lbl.SetValue(Canvas.TopProperty, 0.0);

                    lbl.SetValue(Canvas.LeftProperty, (double)i * 3 - 8);

                    lbl.HorizontalAlignment = System.Windows.HorizontalAlignment.Left;

                    lbl.HorizontalContentAlignment = System.Windows.HorizontalAlignment.Left;

                    ScaleTransform st = new ScaleTransform();

                    st.ScaleY = -1;

                    lbl.RenderTransform = st;

                    Line line = new Line();

                    line.Y1 = 0;

                    line.Y2 = 5;

                    line.X1 = i * 3;

                    line.X2 = i * 3;

                    line.Stroke = System.Windows.Media.Brushes.Black;

                    line.StrokeThickness = 1;

                    line.RenderTransform = st;

                    this.Canvas1.Children.Add(lbl);

                    this.Canvas1.Children.Add(line);

                catch (System.Exception se)

            for (int i = 0; i 66; i++)

                Line line = new Line();

                line.X1 = slices[i];

                line.Y1 = sens[i];

                line.X2 = slices[i + 1] + 1;

                line.Y2 = sens[i + 1];

                line.Stroke = System.Windows.Media.Brushes.Black;

                line.StrokeThickness = 1;

                this.Canvas1.Children.Add(line);

        }

和上一版代码相比,你可能看出了些变化,对,就是添加了从36行到43行的代码还有45行的代码,没错,这几行代码就是画刻度的。而坐标上的描述是通过XAML的变化来实现的。

这里唯一不足的是坐标图是固定大小的,如果使用依赖属性来定义,这些值都可以通过外部绑定来实现,还有图的大小可以自己设置,这些在后续的文章中接着描述。

本次结果的效果图如下:

使用WPF画横纵坐标图,坐标原点在左下角(2)

还比较粗糙,但基本实现了想实现的功能。

继续阅读