版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/wuma0q1an/article/details/50884926
成功创建一个我的modern ui程序之后,就可以开始创建页面,在页面里面布局写入控件,并且显示它。
首先创在项目--添加--新建项--选择modern UI for wpf的basic page.xmal页面。
点击设计//XAML里面的XAML,就可以使用代码来进行页面设计了。其中,下方红色框里面的可以删去。
然后就可以使用Grid来进行布局了,以下是一段示范代码,实现下面的效果。由于使用grid布局比较蛋疼,但是我还是仅仅使用了grid布局(是因为没有接粗到其他布局),其中<Grid.RowDefinitions>是定义行,<Grid.ColumnDefinitions>是定义列,可以使用Height="*"或者Widht="*"来进行比例的调节。
<UserControl x:Class="zxgkkpt.Pages.Login.LoginUser"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mui="http://firstfloorsoftware.com/ModernUI"
mc:Ignorable="d"
d:DesignHeight="400" d:DesignWidth="400">
<Grid Style="{StaticResource ContentRoot}">
<StackPanel MinWidth="200" Margin="-17,-29,-20,-18">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="30"/>
<RowDefinition Height="30"/>
<RowDefinition Height="30"/>
<RowDefinition Height="30"/>
<RowDefinition Height="30"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="100"/>
<ColumnDefinition Width="20"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<TextBlock Grid.Row="0" Grid.Column="0" HorizontalAlignment="Right" VerticalAlignment="Top" Text="个人信息" Style="{StaticResource Heading2}"/>
<TextBlock Grid.Row="1" Grid.Column="0" HorizontalAlignment="Right" VerticalAlignment="Top" Text="姓名:" />
<TextBlock Grid.Row="2" Grid.Column="0" HorizontalAlignment="Right" VerticalAlignment="Top" Text="邮箱:" />
<TextBlock Grid.Row="3" Grid.Column="0" HorizontalAlignment="Right" VerticalAlignment="Top" Text="本次登录:" />
<TextBlock Grid.Row="1" Grid.Column="2" HorizontalAlignment="Left" VerticalAlignment="Top" Text="" x:Name="logName" />
<TextBlock Grid.Row="2" Grid.Column="2" HorizontalAlignment="Left" VerticalAlignment="Top" Text="" x:Name="logEmail"/>
<TextBlock Grid.Row="3" Grid.Column="2" HorizontalAlignment="Left" VerticalAlignment="Top" Text="" x:Name="logTime"/>
<Button Grid.Row="4" Grid.Column="0" HorizontalAlignment="Right" VerticalAlignment="Top" Content="注销" x:Name="LogOff" Click="LogOff_Click" />
</Grid>
</StackPanel>
</Grid>
</UserControl>
所以,Grid布局就介绍这么多啦。Grid可以在里面继续添加Grid或者其他布局控件如<ScrollViewer>之类的。
扫描二维码关注公众号,回复:
5295868 查看本文章