站长之家

站长资讯通告:
您的位置: 首页 » 编程 » 语言 » 正文

用Xaml做网页框架(4)

[ ] 来源: cnblogs 评论: 0 分享至:

百度权重查询 站长交易 友情链接交换 网站建设,网站设计,企业建站就找313

下面两图分别是设计效果和实际效果:

至此我们完成了基本的框架设计,现在设计视图中的效果如下:

到目前为止的全部代码:

以下为引用的内容:
<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.Resources>

        <ResourceDictionary>

            <ResourceDictionary.MergedDictionaries>

                <ResourceDictionary Source="back.xaml"/>

            </ResourceDictionary.MergedDictionaries>

        </ResourceDictionary>

    </Page.Resources>

    <ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto">

        <Grid MinHeight="900" MinWidth="1000" Background="{StaticResource back}">

            <Grid.ColumnDefinitions>

                <ColumnDefinition Width="8*"/>

                <ColumnDefinition Width="84*"/>

                <ColumnDefinition Width="8*"/>

            </Grid.ColumnDefinitions>

            <Rectangle Width="20" Grid.Column="0" HorizontalAlignment="Right" Margin="0,0,0,0">

                <Rectangle.Fill>

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

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

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

                    </LinearGradientBrush>

                </Rectangle.Fill>

            </Rectangle>

            <Rectangle Width="20" Grid.Column="3" HorizontalAlignment="Left" Margin="0,0,0,0">

                <Rectangle.Fill>

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

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

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

                    </LinearGradientBrush>

                </Rectangle.Fill>

            </Rectangle>

            <DockPanel Background="#FFF" Grid.Column="1">

                <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 x:Name="Side" Background="#1E874900" DockPanel.Dock="Right" Width="245"></DockPanel>

                    <StackPanel x:Name="Content"></StackPanel>

                </DockPanel>

            </DockPanel>

        </Grid>

    </ScrollViewer>

</Page>


本篇至此结束,在后续的篇章中将继续讲解页面主体中各个区块的制作。

文中如有不妥的地方,欢迎随时指正,我不介意听到异议,分歧是交流和进步的开始,我也有太多东西需要向各位学习:)

分享至:
Tags:网页框架 XAML
最新图文资讯
1 2 3 4 5 6
理智评论文明上网,拒绝恶意谩骂 用户名:
网友评论
站长之家专栏推荐
商讯
最新视频
论坛推荐帖子
评测
关于站长之家 - 联系我们 - 广告服务 - 友情链接 - 网站地图 - 版权声明 - 人才招聘 - 帮助