[界面開發新秀]AYUI開發360領航版系列教程-AyWindow接入[1/40]

時間 2019-11-06

標籤界面開發新秀 ayui 領航系列教程 aywindow 简体版

原文原文鏈接

開發包DLL下載地址：請加入 466717219羣，本身下載（已經發布ayui3.7，在羣裏，爲了避免讓你做爲收藏工具，也只有入羣才能下載，喜歡你就進。不喜歡你仍是不要來了）html

AYUI初衷：簡單化商業軟件界面的開發，提供UI框架，打包框架，安裝與卸載框架，自動更新框架系列做品，AY一我的完成。瀏覽器

.NET Reactor 5.0 加密混淆工具下載：百度雲安全

提取360資源:百度雲服務器

上篇文章 AYUI 炫麗PC開發UI框架2016年6月15日對外免費開發使用 mvc

博客園給個人建議，讓我不知道怎麼寫文章了app

AY承諾：使用AYUI作出本身的做品，若是是好做品，我會放到官網去推薦展現，給大家推廣本身的機會，並免費給大家受權，還可能獎勵源碼。合做開發。框架

若是開發者達到1000人，那麼AYUI的dll將免費受權，沒有任何阻塞，從那天起，ayui將免費異步

（受權費目前是300元，永久免費更新，不收費，主要維持ayjs.net的服務器費用，但願理解）ide

對於開發者使用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