（初学）wpf仿QQ界面-整体布局

     跟一个小学弟一起学习wpf，小学弟是刚初中毕业，对编程刚刚接触，我挺怕自己带的不好，影响小学弟以后在编程方向的学习兴趣。我承认自己水平不高，但是在努力去学习新知识！一起加油吧！在此以博客，记录学习进度。

       

<Window x:Class="QQ.MainWindow"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
         xmlns:local="clr-namespace:QQ"
         mc:Ignorable="d"
         Title="MainWindow" WindowStyle="None" Height="350" Width="525" WindowStartupLocation="CenterScreen">

<Grid>
    <!--设置窗体的阴影效果-->（关于设置窗体的阴影透明效果还不是很理解，此段代码是在网上copy过来的，不明其意）
      <Border Background="#FFFFFF" CornerRadius="3" Margin="{TemplateBinding Padding}">
            <Border.Effect>
                       <DropShadowEffect BlurRadius="15" Direction="-90" RenderingBias="Quality" ShadowDepth="2"/>
             </Border.Effect>
    <!-- 登录面板 -->
   <Grid Height="483" Width="458" Visibility="Visible" >
             <!--总体分三行-->
             <Grid.RowDefinitions>
                       <RowDefinition Height="30"></RowDefinition>
                       <RowDefinition Height="150"></RowDefinition>
                       <RowDefinition Height="150"></RowDefinition>
              </Grid.RowDefinitions>
         <!--第一行-->
        <Grid Grid.Row="0">
                 <!--第一行分两列-->
                 <Grid.ColumnDefinitions >
                          <ColumnDefinition Width="340"></ColumnDefinition>
                          <ColumnDefinition ></ColumnDefinition>
                 </Grid.ColumnDefinitions>
         </Grid>
         <!--第二行-->
         <Grid Grid.Row="1"></Grid>
          <!--第三行-->
          <Grid Grid.Row="2">
                    <!--第三行分三列-->
                  <Grid.ColumnDefinitions>
                              <ColumnDefinition Width="136"></ColumnDefinition>
                              <ColumnDefinition Width="192"></ColumnDefinition>
                              <ColumnDefinition></ColumnDefinition>
                   </Grid.ColumnDefinitions>
                    <!--第三行第一列-->
                   <Grid Grid.Column="0">
                               <!--分两行-->
                               <Grid.RowDefinitions>
                                          <RowDefinition Height="3*"></RowDefinition>
                                          <RowDefinition></RowDefinition>
                               </Grid.RowDefinitions>
           </Grid>
            <!--第三行第二列-->
            <Grid Grid.Column="1">
                      <!--分四行-->
                      <Grid.RowDefinitions>
                                <RowDefinition></RowDefinition>
                                <RowDefinition></RowDefinition>
                                <RowDefinition></RowDefinition>
                                <RowDefinition></RowDefinition>
                     </Grid.RowDefinitions>
            </Grid>
            <!--第三行第三列-->
             <Grid Grid.Column="2">
                           <!--分三行-->
                           <Grid.RowDefinitions>
                                      <RowDefinition></RowDefinition>
                                      <RowDefinition></RowDefinition>
                                      <RowDefinition Height="2*"></RowDefinition>
                           </Grid.RowDefinitions>
            </Grid>

         </Grid>
      </Grid>
</Border>
  <!--主界面- -->
 <Grid>
  （待完成......）
 </Grid>
</Grid>
</Window>

  总体思路就是用Grid面板布局，分行和分列。这是登录窗体的整体布局，QQ个人主页的布局也是如此，还未完成。我们会在一个大的Grid面板里放两个小的Grid面板，分别是登录界面和个人主界面，然后添加组件，实现按钮的单击事件，我们自己做的这些还算简单。开始深入浅出wpf之旅！