用Xaml做網頁框架_.Net教程
推薦：校內網API的.net版本XiaoNei.Net 1.0(非官方)校內API開放也有一段時間了，也沒有太關注，正好新版本的SNS開發(fā)到了API這一塊，正好借鑒一下XiaoNei，F(xiàn)B，MySpace的API。 且聞校內API比較有前途，最近的API編程大賽也比較火，而且人氣也較
下面就開始編寫XAML，首先來定義一下頁面的屬性：
| 以下為引用的內容： <Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" WindowTitle="MailMail" FontFamily="微軟雅黑" Background="#FF424242" SnapsToDevicePixels="True"></Page> |
WindowTitle就是頁面標題。
SnapsToDevicePixels屬性很重要，它會使我們的圖像自動進行像素對齊，從而去除模糊的邊緣，這可以使我們的網頁看起來更像傳統(tǒng)網頁。
接下來這一點很有趣，我們要在頁面中放置ScrollViewer，否則我們的網頁超出屏幕的時候不會顯示滾動條，連這個都要我們自助使用了：
<ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto"></ScrollViewer>
把橫向和縱向滾動條的顯示屬性都設為Auto是個比較好的方案，這樣在不需要的時候就會自動隱藏了。
ScrollViewer中要放置一個Grid用于總體布局：
| 以下為引用的內容： <Grid MinHeight="900" MinWidth="1000"> <Grid.ColumnDefinitions> <ColumnDefinition Width="8*"/> <ColumnDefinition Width="84*"/> <ColumnDefinition Width="8*"/> </Grid.ColumnDefinitions> </Grid> |
其中定義了三個列，兩邊8%留作空白，中間84%是頁面主體。
在Grid里放置DockPanel用于細化布局：<DockPanel Background="#FFF" Grid.Column="1"></DockPanel>
DockPanel中裝載的就是頁面的各個區(qū)塊了：
| 以下為引用的內容： <DockPanel x:Name="Head" DockPanel.Dock="Top" Background="#FF4A4A4A" Height="115"></DockPanel> <Border x:Name="HeadLine" Background="#888" BorderThickness="0,1" DockPanel.Dock="Top" Height="15"></Border> <Grid x:Name="Show" Background="#EEE" DockPanel.Dock="Top" Height="135" ClipToBounds="True"></Grid> <Border x:Name="Channel" DockPanel.Dock="Top" Height="50" Background="#FF8E45" BorderThickness="0,1,0,0" BorderBrush="#FFF"></Border> <Border x:Name="Footer" Background="#666" BorderBrush="#888" BorderThickness="0,4,0,0" DockPanel.Dock="Bottom" Height="55"></Border> <DockPanel x:Name="Body" Background="#FFFFFCD1"></DockPanel> |
僅僅通過DockPanel.Dock屬性就可以將各個區(qū)塊完美的放置到它所應處的位置，實際應用中可以比這復雜很多，但實現(xiàn)起來依然是非常簡單。
PS：掌握了WPF布局后，再去其他環(huán)境中布局，都會有捶墻的沖動～
現(xiàn)在我們的界面就是下面這樣了：
我把每個區(qū)塊都命名并對應到此圖上，這只是為了便于理解，并不是必需的。
在Body中加入兩個區(qū)塊，即邊欄和內容：
| 以下為引用的內容： <DockPanel x:Name="Side" Background="#1E874900" DockPanel.Dock="Right" Width="245"></DockPanel> <StackPanel x:Name="Content"></StackPanel> |
其實不用Body，直接把這兩個元素放在上層使用也沒有問題，我在這里是希望它們有一個共同的背景才這樣設計的。
分享：Asp.net Mvc Framework可以在Controller中使用的Url.Action方法原本的Url.Action方法是利用RouteCollection來實現(xiàn)Url的Routing的。 所以這里用一個擴展方法重現(xiàn)一下 以下為引用的內容：
- asp.net如何得到GRIDVIEW中某行某列值的方法
- .net SMTP發(fā)送Email實例(可帶附件)
- js實現(xiàn)廣告漂浮效果的小例子
- asp.net Repeater 數(shù)據綁定的具體實現(xiàn)
- Asp.Net 無刷新文件上傳并顯示進度條的實現(xiàn)方法及思路
- Asp.net獲取客戶端IP常見代碼存在的偽造IP問題探討
- VS2010 水晶報表的使用方法
- ASP.NET中操作SQL數(shù)據庫(連接字符串的配置及獲取)
- asp.net頁面?zhèn)髦禍y試實例代碼
- DataGridView - DataGridViewCheckBoxCell的使用介紹
- asp.net中javascript的引用(直接引入和間接引入)
- 三層+存儲過程實現(xiàn)分頁示例代碼
- 相關鏈接：
- 教程說明：
.Net教程-用Xaml做網頁框架
。