[界面开发新秀]AYUI开发360领航版系列教程-AyWindow接入[1/40]

开发包DLL下载地址:请加入 466717219群,自己下载(已经发布ayui3.7,在群里,为了不让你作为收藏工具,也只有入群才能下载,喜欢你就进。不喜欢你还是不要来了)

AYUI初衷:简单化商业软件界面的开发,提供UI框架,打包框架,安装与卸载框架,自动更新框架系列作品,AY一个人完成。

.NET Reactor 5.0 加密混淆工具下载:百度云

提取360资源:百度云

上篇文章 AYUI 炫丽PC开发UI框架2016年6月15日对外免费开发使用 

博客园给我的建议,让我不知道怎么写文章了

AY承诺:使用AYUI做出自己的作品,如果是好作品,我会放到官网去推荐展示,给你们推广自己的机会,并免费给你们授权,还可能奖励源码。合作开发。

如果开发者达到1000人,那么AYUI的dll将免费授权,没有任何阻塞,从那天起,ayui将免费

(授权费目前是300元,永久免费更新,不收费,主要维持ayjs.net的服务器费用,希望理解)

对于开发者使用ayui开发项目,完全没有任何影响,可以算是免费,只是皮肤窗口有额外的文字和logo而已。其他没有任何功能的限制。

 

AY已经提取好的360:下载

AYUI采用.NET4.0开发,基于WPF,所以可以使用vs2010以上的visual studio的方式去开发

ayui大致展览;

 

下载下来,大家的开发包结构应该是这样的。

开始做了,我使用vs2013,也有vs2015,随便用了。为了兼容vs2010,我肯定不能使用vs2015的语法糖了

新建解决方案

新建wpf项目,AYUI360

然后新建目录lib,拷贝ayui文件夹内的文件

到lib文件夹

打开项目解决方案,拷贝ayui文件夹下的"ay的mvc目录结构你可以快速粘贴创建“文件到wpf项目中去

设置2个jpg图片和xml配置文件的属性,如下

Contents文件夹下的Styles新建S360.xaml

打开App.xaml.cs文件,引入ayui

using System;
using System.Collections.Generic;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Threading.Tasks;
using System.Windows;

namespace AYUI360
{
    /// <summary>
    /// App.xaml 的交互逻辑
    /// </summary>
    public partial class App : Application
    {
        protected override void OnStartup(StartupEventArgs e)
        {
            Application.Current.AddResourceDictionary("/AYUI360;component/Contents/Styles/S360.xaml").AYUI();
            base.OnStartup(e);
        }
    }
}

打开MainWindow.xaml.cs,后台继承更改下,继承AyWindow

测量360安全卫士领航版本的宽高是800*600

前台

<control:AyWindow x:Class="AYUI360.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:control="http://www.ayjs.net/controls" 
        Title="AY的360安全卫士" Height="600" Width="800">
    <Grid>
        
    </Grid>
</control:AyWindow>

设置窗体基本属性,MaxButtonVisibility是AyWindow提供的

WindowStartupLocation="CenterScreen" ResizeMode="NoResize" MaxButtonVisibility="Collapsed"

运行项目:

由于Aywindow的窗体阴影和resize预留边距24像素,所以,内容边距是24px,窗体原来是800和600,要进行重新计算,宽和高要加上29px

修改后xaml代码

<control:AyWindow x:Class="AYUI360.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:control="http://www.ayjs.net/controls" 
        Title="AY的360安全卫士" Height="629" Width="829"
        WindowStartupLocation="CenterScreen" ResizeMode="NoResize" MaxButtonVisibility="Collapsed"
        >
    <Grid Margin="0,-24,0,0" Background="Transparent">
    
    </Grid>
</control:AyWindow>

运行项目,此时的窗体,已经可以拖动,关于AyWindow提供了我自己定义的很多属性,我们先学习下,常用的

窗体模式阴影控制,如果自己写还要考虑最大化阴影的边距问题,使用aywindow不用考虑

1. 依赖属性 WindowEntranceBackgroundMode="2"

关于属性介绍:

2. 阴影的大小ShadowMargin是个thickness属性,例如ShadowMargin=10, 暂时问题,阴影过大,导致无法窗体resize。也是不常用,保持默认,不要设置它

3. ResizeMode   window自带的,aywindow加了判断,如果是NoResize,那么aywindow是不会创建8个thumb用于窗体调整大小的。

4. CanDrag,bool类型的,判断是否可以移动窗体,默认可以

5. IsCoverTaskBar默认是false,控制最大化是否遮盖任务栏

6. 控制是否显示最大化按钮(restoreWindowVisibility暂时无效,已经被MaxButtonVisibility取代)

同理:

最小化:MinButtonVisibility

关闭按钮:CloseButtonVisibility 

皮肤设置按钮:SkinButtonVisibility

标题栏是否显示:TitleVisibility

窗体菜单:WindowMenuVisibility  如果窗体设置了WindowMenu依赖属性,那么就会显示,默认是不显示,只有设置了才显示,但是最终都是取决于WindowMenuVisibility  属性

窗体右上角整个按钮组可见性:WindowRightButtonGroupVisibility

 

7.常用属性:CloseIsHideWindow,用于close窗体时候,是close窗体,还是hide窗体,主要用于托盘图标。

窗体圆角

 

窗体描边粗细和颜色:BorderThickness,BorderBrush(window自带的)

8. CloseButtonMargin右上角按钮组的边距控制

9.TitleBarHeight 标题栏高度

10.设置标题栏的Brush,可以是纯色,WindowTitleBarBg  这个主要在AyMessageBox中使用了。

11.VideoUri,用于设置窗体的背景为视频背景,如果有值,那么窗体背景就会启动个视频背景。

12.GaoSiRadius控制窗体背景模糊程度。

13.BgData窗体背景图, ( Ay.Framework.WPF.Controls.AyTransition BgData )或者是纯色对象

14. 关于窗体

属性,在皮肤设置窗口,点击设置

在炫彩支持里面去控制,第四个Opacity4暂时框架预留的。暂时没地方使用和调整。

你可以在窗体上,某某的透明度,绑定这4个属性中一个,然后这里调整,你界面上绑定的element的opacity值就会跟着动了。

 

14. 窗体的右上角按钮组左侧区域

用这个可以实现

这几个地方的额外按钮。直接设置ToolBarContent,它是ContentPresenter呈现的。

 

 

15 Icon属性,如果你设置了他,那么你的窗体就会显示图标

例如我设置了图标

和任务栏都会显示了。但是我没有提供调整图标大小的接口,你可以自己创建好适合的图标大小。一般来说,我提供Icon属性,是因为任务栏需要显示,我一般都会设置TitleVisibility不可见,在窗体内容上加上左上角的东西。

 

 

 16.自定义托盘图标区的需求,这里ayui已经提供了,关于讲解,我会具体在制作360托盘菜单的地方去写

实现自定义图标

下面是我实现的qq管家托盘,

 

 

 

常用方法:

1.当你想自定义右侧窗体图标或者某某东西,想触发AYUI的事件,可以在后台base点下面的方法,即可调用,比如你可以把右侧的几个按钮全都隐藏,实现自己的,然后单击,时候触发下面的方法即可。

2. 假如你想就用AYUI提供的按钮,但是想触发的时候,又想添加点操作,比如触发最大化前,隐藏窗体右下角的 resize窗体调整图标,然后再最大化, 还原时候,显示右下角的resize控件。

ayui定义了窗体行为的6个委托,方便你使用,一旦你赋值了方法,窗体,比如窗体最大化的时候,你给MaxWindowMethodOverride绑定了方法,那么他就会按照你的来,而你可以在里面定义完其他操作后,然后base.DoMaxOrReStoreWindow了

public Action CloseWindowMethodOverride;
public Action MinWindowMethodOverride;
public Action MaxWindowMethodOverride;
public Action SkinWindowMethodOverride;
public Action MenuWindowMethodOverride;
//2016-6-3 11:20:46添加 用于调整窗体大小时候触发委托
public Action ResizeWindowInvokeMethod;

 

 关于AyWindow的介绍就到这里,我的设计是背景与内容分离,我提供背景层,拖拽层,阴影层,右上角层,左上角层,还有给你留的内容层,内容你去画,这就是我的aywindow。

AYUI提供了将近50个控件,还有很多其他控件.

====================www.ayjs.net 杨洋 wpfui.com ayui ay aaronyang=======请不要转载谢谢了。=========

接下来,我们开始做360领航版。

修改窗体后的代码:对了aywindow,建议一直设置minheight和minwidth,不要设置maxwidth和maxheight,因为resize的方式是我写的,不支持maxwidth和maxheight,ay也不打算去解决。

<control:AyWindow x:Class="AYUI360.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:control="http://www.ayjs.net/controls" 
        Title="AY的360安全卫士" Height="629" Width="829"  MinHeight="629" MinWidth="829" 
        WindowStartupLocation="CenterScreen" ResizeMode="NoResize" MaxButtonVisibility="Collapsed"
        Icon="/AYUI360;component/Contents/Images/ICONS/app.ico" TitleVisibility="Collapsed"
        >
    <Grid Margin="0,-24,0,0" Background="Transparent">

    </Grid>
</control:AyWindow>

  

 


 

 文章写的太长,看起来太累,大家先玩玩AyWindow吧,在上面加上内容

 明天看是aywindow加上内容,1天搞定第一个页面。

 

 

 

 AYUI作品:让你信任AYUI,只在第一篇教程展示,为了吸引观众

1.官方DEMO

也是官方使用配套的DEMO,支持多显示器,图片自动配色,下载体验地址:下载

 

2.QQ管家

实现:6大界面模块效果和动画,包括软件管家开启效果,包括托盘图标自定义界面。 下载体验地址:下载

 

3.后台管理界面DEMO

实现:登陆界面,左侧树列表,右侧datagrid显示数据,以及编辑数据,分页,查询。 下载体验地址:下载

 

 

4.自定义安装界面Wizard DEMO

安装与卸载(因为当时ayui版本,不兼容xp,所以我要重新做)体验地址:下载

 

5. 监控系统demo

主要实现图表功能,界面还是AYUI官方DEMO改过来的。体验地址:不方便给,因为这是我帮别人做的。

 

6. QQ登陆窗体,3D窗体

下拉动画,item动画,键盘控件,翻转窗体,tab焦点转移等 ,体验地址:下载

 

7. AY做的最久的QQ播放器,还在更新,播放功能都是实现的。

 拖放调整,播放进度条,异步加载列表,换肤cef1精简版浏览器使用与本地交互,vlc使用,播放,专辑页面效果:体验地址

测试步骤:点击右下角的播放队列,然后导入本地歌曲。异步加载列表,双击播放,选中后可以拖放,可以单击未选中的item进行选区选择,

 

只是为了吸引开发者,不是图文,以后的博客不会再发

 

 

 

 

 

 

 

posted @ 2016-06-16 11:37  AYUI框架  阅读(4359)  评论(42编辑  收藏