（初學）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之旅！