课堂练习

作者:王福驰

撰写时间:2019年 5月8日

开发工具与关键技术:XAML、WPF

模仿驾车宝典,虽然只做了主页面一小小功能。

只是设置页面,还没有实现功能

主页面设置宽为1000、高为600,最大宽为1000、最大高为600

    <Grid>

        <Grid.RowDefinitions>

            <RowDefinition Height="20*"/>

            <RowDefinition Height="278*"/>

        </Grid.RowDefinitions>

        <!--第0列-->

        <Grid Background="#FF0089F2" Grid.Row="0" >

            <Image Source="D:\练习\WPF练习\IO\IO\Image\驾车宝典.png" HorizontalAlignment="Left" VerticalAlignment="Top" ></Image>

            <ComboBox Width="120" Height="20" Margin="167,10,713,10" >

                <ComboBox.Background>

                    <LinearGradientBrush EndPoint="0,1" StartPoint="0,0">

                        <GradientStop Color="#FFF0F0F0" Offset="0"/>

                        <GradientStop Color="#FF0089F2" Offset="1"/>

                    </LinearGradientBrush>

                </ComboBox.Background>

            </ComboBox>

            <Image x:Name="RenWu_png" Source="Image/人物图片.png" Margin="423,0,532,0" Stretch="Fill" Cursor="Hand"  RenderTransformOrigin="0.5,0.5">

                <Image.RenderTransform>

                    <TransformGroup>

                        <ScaleTransform ScaleX="-1"/>

                        <SkewTransform/>

                        <RotateTransform/>

                        <TranslateTransform/>

                    </TransformGroup>

                </Image.RenderTransform>

            </Image>

            <Button x:Name="button1" Content="登录" HorizontalAlignment="Left" Margin="471,11,0,0" VerticalAlignment="Top" Width="75" Background="#FF0089F2" BorderBrush="#FF308ED6" Foreground="#FFF4F5F6"/>

            <Image x:Name="VIP" Source="Image/VIP图片.png" Margin="551,0,404,0"></Image>

            <Button x:Name="button_sj" Content="下载手机版" HorizontalAlignment="Left" Margin="601,10,0,0" VerticalAlignment="Top" Width="75" Background="#FF0089F2" BorderBrush="#FF308ED6" Foreground="#FFF4F5F6"/>

            <Button x:Name="button_tb" Content="同步数据" HorizontalAlignment="Left" Margin="676,10,0,0" VerticalAlignment="Top" Width="75" Background="#FF0089F2" BorderBrush="#FF308ED6" Foreground="#FFF4F5F6"/>

        </Grid>

        <Image x:Name="POWER___STANDBY_png" Margin="939,2,1,1" Source="Image\008.png" Stretch="Fill" Cursor="Hand" MouseLeftButtonDown="POWER___STANDBY_png_MouseLeftButtonDown" RenderTransformOrigin="0.5,0.5">

            <Image.RenderTransform>

                <TransformGroup>

                    <ScaleTransform ScaleX="-1"/>

                    <SkewTransform/>

                    <RotateTransform/>

                    <TranslateTransform/>

                </TransformGroup>

            </Image.RenderTransform>

        </Image>

        <Image x:Name="POWER___SHUT_DOWN_png" Margin="864,-2,62,2" Source="Image\029.png" Stretch="Fill" Cursor="Hand" MouseLeftButtonDown="POWER___SHUT_DOWN_png_MouseLeftButtonDown" RenderTransformOrigin="0.568,0.432">

            <Image.RenderTransform>

                <TransformGroup>

                    <ScaleTransform ScaleX="-1"/>

                    <SkewTransform/>

                    <RotateTransform/>

                    <TranslateTransform X="-5.984"/>

                </TransformGroup>

            </Image.RenderTransform>

        </Image>

        <TabControl x:Name="tabControl" Grid.Row="1" Grid.RowSpan="3" >

            <TabItem Header="" BorderBrush="White" Margin="0" Width="155">

            </TabItem>

            <TabItem Header="科目一" BorderBrush="White" Margin="0" Width="166">

                <TabItem.Background>

                    <LinearGradientBrush EndPoint="0,1" StartPoint="0,0">

                        <GradientStop Color="#FFF0F0F0" Offset="0"/>

                        <GradientStop Color="White" Offset="1"/>

                    </LinearGradientBrush>

                </TabItem.Background>

                <Grid Grid.Row="0">

                    <Grid.RowDefinitions>

                        <RowDefinition Height="150*"/>

                        <RowDefinition Height="150*"/>

                        <RowDefinition Height="30*"/>

                    </Grid.RowDefinitions>

                    <Grid.ColumnDefinitions>

                        <ColumnDefinition Width="51*"/>

                        <ColumnDefinition Width="208*"/>

                    </Grid.ColumnDefinitions>

                    <Grid Grid.Row="0" Grid.Column="0" Width="200" >

                        <Ellipse x:Name="ellipse" Fill="Blue" StrokeThickness="3"  Canvas.Left="1" Canvas.Top="74" Margin="20,43,20,43.6"/>

                        <Rectangle x:Name="rec"  RenderTransformOrigin="0.5,0.5"  Width="160" Height="150" HorizontalAlignment="Center" VerticalAlignment="Center" Canvas.Left="46" Canvas.Top="36" >

                            <Rectangle.RenderTransform>

                                <TransformGroup>

                                    <ScaleTransform/>

                                    <SkewTransform/>

                                    <RotateTransform Angle="360" CenterX="0" CenterY="0"/>

                                    <TranslateTransform/>

                                </TransformGroup>

                            </Rectangle.RenderTransform>

                        </Rectangle>

                    </Grid>

                    <Grid  Grid.Row="0" Grid.Column="1">

                        <Grid.RowDefinitions>

                            <RowDefinition Height="30*"/>

                            <RowDefinition Height="30*"/>

                        </Grid.RowDefinitions>

                        <Grid Grid.Row="0">

                            <Grid.RowDefinitions>

                                <RowDefinition/>

                                <RowDefinition/>

                            </Grid.RowDefinitions>

                            <Label Grid.Row="0" Grid.Column="0" FontWeight="Bold" FontSize="20"  HorizontalAlignment="Center" Grid.RowSpan="2" VerticalAlignment="Center" >全量考题,考前必刷</Label>

                            <Label  Grid.RowSpan="2"  Grid.Row="1" Grid.Column="0" HorizontalAlignment="Center" VerticalAlignment="Center" >真实还原交管局考题难度,考前必刷,先练好考</Label>

                        </Grid>

                        <Grid Grid.Row="1">

                            <Image Source="D:\练习\WPF练习\IO\IO\Image\搜狗截图20190413155632.png"></Image>

                        </Grid>

                    </Grid>

                    <Grid Grid.Row="1" Grid.Column="0" Width="200" HorizontalAlignment="Center" >

                        <Ellipse x:Name="ellipse1"  Fill="Blue" StrokeThickness="3"  Canvas.Left="1" Canvas.Top="74" Margin="20,43,20,43.6">

                        </Ellipse>

                    </Grid>

                    <Grid  Grid.Row="1" Grid.Column="1">

                        <Grid.RowDefinitions>

                            <RowDefinition Height="30*"/>

                            <RowDefinition Height="30*"/>

                        </Grid.RowDefinitions>

                        <Grid Grid.Row="0">

                            <Grid.RowDefinitions>

                                <RowDefinition/>

                                <RowDefinition/>

                            </Grid.RowDefinitions>

                            <Label Grid.Row="0" Grid.Column="0" FontWeight="Bold" FontSize="20" HorizontalAlignment="Center" Grid.RowSpan="2" VerticalAlignment="Center" >模拟考试,100%仿真</Label>

                            <Label Margin="0,0,0,-0.4" Grid.RowSpan="2"  Grid.Row="1" Grid.Column="0" HorizontalAlignment="Center" VerticalAlignment="Center" >直击全真考题,模拟真实考试环境,还原真实考题难度</Label>

                        </Grid>

                        <Grid Grid.Row="1">

                            <Image Source="D:\练习\WPF练习\IO\IO\Image\搜狗截图20190413155632.png"></Image>

                        </Grid>

                    </Grid>

                    <Grid Grid.Row="2" Grid.Column="1">

                        <Button Width="100"   HorizontalAlignment="Left" Background="White" Margin="598,0,0,-0.2" BorderBrush="White">

                            我的收藏</Button>

                        <Button Width="100" Background="#fff" Margin="301,0,0,0" BorderBrush="White" HorizontalAlignment="Right">我的错题</Button>

                    </Grid>

                </Grid>

            </TabItem>

            <TabItem Header="科目二" BorderBrush="White" Margin="0" Width="166">

                <TabItem.Background>

                    <LinearGradientBrush EndPoint="0,1" StartPoint="0,0">

                        <GradientStop Color="#FFF0F0F0" Offset="0"/>

                        <GradientStop Color="White" Offset="1"/>

                    </LinearGradientBrush>

                </TabItem.Background>

                <Grid Background="#FFE5E5E5"/>

            </TabItem>

            <TabItem Header="科目三" BorderBrush="White" Margin="0" Width="166">

                <TabItem.Background>

                    <LinearGradientBrush EndPoint="0,1" StartPoint="0,0">

                        <GradientStop Color="#FFF0F0F0" Offset="0"/>

                        <GradientStop Color="White" Offset="1"/>

                    </LinearGradientBrush>

                </TabItem.Background>

                <Grid Background="#FFE5E5E5"/>

            </TabItem>

            <TabItem Header="科目四" BorderBrush="White" Margin="0" Width="166">

                <TabItem.Background>

                    <LinearGradientBrush EndPoint="0,1" StartPoint="0,0">

                        <GradientStop Color="#FFF0F0F0" Offset="0"/>

                        <GradientStop Color="White" Offset="1"/>

                    </LinearGradientBrush>

                </TabItem.Background>

                <Grid Grid.Row="0">

                    <Grid.RowDefinitions>

                        <RowDefinition Height="150*"/>

                        <RowDefinition Height="150*"/>

                        <RowDefinition Height="30*"/>

                    </Grid.RowDefinitions>

                    <Grid.ColumnDefinitions>

                        <ColumnDefinition Width="51*"/>

                        <ColumnDefinition Width="208*"/>

                    </Grid.ColumnDefinitions>

                    <Grid Grid.Row="0" Grid.Column="0" Width="200" >

                        <Ellipse x:Name="ellipse4" Fill="Blue" StrokeThickness="3"  Canvas.Left="1" Canvas.Top="74" Margin="20,43,20,43.6"/>

                    </Grid>

                    <Grid  Grid.Row="0" Grid.Column="1">

                        <Grid.RowDefinitions>

                            <RowDefinition Height="30*"/>

                            <RowDefinition Height="30*"/>

                        </Grid.RowDefinitions>

                        <Grid Grid.Row="0">

                            <Grid.RowDefinitions>

                                <RowDefinition/>

                                <RowDefinition/>

                            </Grid.RowDefinitions>

                            <Label Grid.Row="0" Grid.Column="0" FontWeight="Bold" FontSize="20"  HorizontalAlignment="Center" Grid.RowSpan="2" VerticalAlignment="Center" >全量考题,考前必刷</Label>

                            <Label  Grid.RowSpan="2"  Grid.Row="1" Grid.Column="0" HorizontalAlignment="Center" VerticalAlignment="Center" >真实还原交管局考题难度,考前必刷,先练好考</Label>

                        </Grid>

                        <Grid Grid.Row="1">

                            <Image Source="D:\练习\WPF练习\IO\IO\Image\搜狗截图20190413155632.png"></Image>

                        </Grid>

                    </Grid>

                    <Grid Grid.Row="1" Grid.Column="0" Width="200" HorizontalAlignment="Center" >

                        <Ellipse x:Name="ellipse5"  Fill="Blue" StrokeThickness="3"  Canvas.Left="1" Canvas.Top="74" Margin="20,43,20,43.6">

                        </Ellipse>

                    </Grid>

                    <Grid  Grid.Row="1" Grid.Column="1">

                        <Grid.RowDefinitions>

                            <RowDefinition Height="30*"/>

                            <RowDefinition Height="30*"/>

                        </Grid.RowDefinitions>

                        <Grid Grid.Row="0">

                            <Grid.RowDefinitions>

                                <RowDefinition/>

                                <RowDefinition/>

                            </Grid.RowDefinitions>

                            <Label Grid.Row="0" Grid.Column="0" FontWeight="Bold" FontSize="20" HorizontalAlignment="Center" Grid.RowSpan="2" VerticalAlignment="Center" >模拟考试,100%仿真</Label>

                            <Label Margin="0,0,0,-0.4" Grid.RowSpan="2"  Grid.Row="1" Grid.Column="0" HorizontalAlignment="Center" VerticalAlignment="Center" >直击全真考题,模拟真实考试环境,还原真实考题难度</Label>

                        </Grid>

                        <Grid Grid.Row="1">

                            <Image Source="D:\练习\WPF练习\IO\IO\Image\搜狗截图20190413155632.png"></Image>

                        </Grid>

                    </Grid>

                    <Grid Grid.Row="2" Grid.Column="1">

                        <Button Width="100"   HorizontalAlignment="Left" Background="White" Margin="598,0,0,-0.2" BorderBrush="White">

                            我的收藏</Button>

                        <Button Width="100" Background="#fff" Margin="301,0,0,0" BorderBrush="White" HorizontalAlignment="Right">我的错题</Button>

                    </Grid>

                </Grid>

            </TabItem>

            <TabItem Header="去买车" BorderBrush="White" Margin="0" Width="157">

                <TabItem.Background>

                    <LinearGradientBrush EndPoint="0,1" StartPoint="0,0">

                        <GradientStop Color="#FFF0F0F0" Offset="0"/>

                        <GradientStop Color="White" Offset="1"/>

                    </LinearGradientBrush>

                </TabItem.Background>

                <Grid Background="#FFE5E5E5"/>

            </TabItem>

        </TabControl>

        <Button x:Name="button" Content="找驾校" Margin="3,0,844,539" Grid.Row="1" BorderThickness="0">

            <Button.Background>

                <LinearGradientBrush EndPoint="0,1" StartPoint="0,0">

                    <GradientStop Color="#FFF0F0F0" Offset="0"/>

                    <GradientStop Color="White" Offset="1"/>

                </LinearGradientBrush>

            </Button.Background>

        </Button>

          </Grid>

课堂练习