Xamarin.iOS - 利用Settings插件與EAIntroView制作App的歡迎界面
關於歡迎界面
很多App第一次啟動都會有一個歡迎界面,歡迎界面往往決定這用戶對App的第一映像,所以歡迎界面的重要性不言而喻。QQ、微博、知乎等App都有制作精良的歡迎界面。
大多數歡迎界面由幾個界面組成,通常界面上會有一張背景圖和簡單的介紹文字,頁面直接的切換類似於Android的ViewPager一樣,靠左右滑動來切換。通常會提供了一個Skip按鈕來讓用戶跳過歡迎界面。
本文將告訴你如何制作一個歡迎界面。
需要用到的第三方庫
- EAIntroView(Object-C寫的歡迎界面第三方庫)
https://github.com/ealeksandrov/EAIntroView- Settings插件 (JamesMontemagno制作的插件之一,用來記錄App的設置數據)
https://github.com/jamesmontemagno/Xamarin.Plugins/tree/master/Settings
一、綁定EAIntroView
為了使用EAIntroView我們首先需要將源生的Ojbect-C庫綁定成Xamarin能用的程序集。
Xamarin綁定請參考Xamarin官網的教程,我只會講主要的操作和貼一些關鍵的代碼。
http://developer.xamarin.com/guides/ios/advanced_topics/binding_objective-c/
在有了Objective Sharpie后綁定已經比較方便了,基本上只要稍微修改下自動生成ApiDefinitions文件即可。
1.獲取EAIntroView源代碼
用git命令將EAIntroView克隆下來,並稍微瀏覽下源生的Ojbect-C代碼
git clone https://github.com/ealeksandrov/EAIntroView.git
2.生成靜態庫
在XCode中建立新的iOS Cocoa Touch Static Library,名字叫做EAIntroViewStatic。
將EAIntroView的源代碼文件(EAIntroView文件夾中,共4個)復制到XCode的工程中。
按下Command+B編譯,我們會發現提示缺少了EARestrictedScrollView相關的文件。這是因為EAIntroView依賴於EARestrictedScrollView造成的,EARestrictedScrollView是EAIntroView的作者的另一個第三方庫。
和EAIntroView一樣,在源生開發中也是利用CocoaPod將源代碼文件引用到當前工程中的,所以我們到Example\Pods\EARestrictedScrollView文件夾中將EARestrictedScrollView的源代碼復制到我們的工程中來。再修改下頭文件的引用就OK了。
再次按下Command+B就提示Build Successed了。
當目標平台為iOS Device時會顯示Build Faild,為了在真機中可以使用,我們需要進行簽名。
點擊工程,就可以進入設置界面,在Build Setting中的Code Signing Idtntity中選擇iOS Developer。
3.制作模擬器與真機都能使用的通用類庫
然后我們需要將.a文件制作成通用類庫
參考這篇文章
官網的綁定教程中也有提及
為了方便我給出Makefile,按照上述操作進行過代碼簽名后可以用make命令方便的生成模擬器和真機(32位、64位)都可以使用的.a文件,如果你開始和我的工程名不一樣的話請注意修改。
XBUILD=/Applications/Xcode.app/Contents/Developer/usr/bin/xcodebuild
PROJECT_ROOT=.
PROJECT=$(PROJECT_ROOT)/EAIntroViewStatic.xcodeproj
TARGET=EAIntroViewStatic
all: libEAIntroView.a
libEAIntroView-i386.a:
$(XBUILD) -project $(PROJECT) -target $(TARGET) -sdk iphonesimulator -configuration Release clean build
-mv $(PROJECT_ROOT)/build/Release-iphonesimulator/lib$(TARGET).a $@
libEAIntroView-armv7.a:
$(XBUILD) -project $(PROJECT) -target $(TARGET) -sdk iphoneos -arch armv7 -configuration Release clean build
-mv $(PROJECT_ROOT)/build/Release-iphoneos/lib$(TARGET).a $@
libEAIntroView-arm64.a:
$(XBUILD) -project $(PROJECT) -target $(TARGET) -sdk iphoneos -arch arm64 -configuration Release clean build
-mv $(PROJECT_ROOT)/build/Release-iphoneos/lib$(TARGET).a $@
libEAIntroView.a: libEAIntroView-armv7.a libEAIntroView-i386.a libEAIntroView-arm64.a
lipo -create -output $@ $^
clean:
-rm -f *.a *.dll
libEAIntroView.a文件就是最終的生成結果。
4.利用Objective Sharpie工具進行綁定
首先還是在Xamarin中建立iOS Binding Project。
將剛剛生成的.a文件拖入到工程中,並修改linkWith描述文件
using System;
using ObjCRuntime;
[assembly: LinkWith("libEAIntroView.a", LinkTarget.ArmV7 | LinkTarget.Simulator | LinkTarget.Arm64 | LinkTarget.ArmV7s | LinkTarget.Simulator64, SmartLink = true, ForceLoad = true)]
然后用Objective Sharpie將Object-C的頭文件翻譯成ApiDefinitions
具體的教程我也不寫了,官網已經非常詳細了,下面是要執行的命令
sharpie bind --output=EAIntroView --namespace=EAIntroView --sdk=iphoneos8.2 [項目的絕對路徑]/EAIntroViewStatic/*.h
生成ApiDefinitions.cs和StructsAndEnums.cs后覆蓋Binding項目的同名文件。
然后還需要進行少量的修改,主要是同名函數的問題(Object-C的函數名由函數名+參數名決定,所以當函數名相同而參數名不同時C#沒辦法分辨,只要改改函數名就行),還有幾個提示是需要需要用強類型替換NObject類型,這個我們可以先不管。
ApiDefinitions.cs文件太長我就不貼了,到時候會放在Github上。
至此我們生成了Xamarin能使用的dll文件。
二、Settings插件的使用
1.安裝Settings插件
有2種方式
這里我們用Nuget省事,在Nuget命令行中輸入如下的命令即可。
Install-Package Xam.Plugins.Settings
另外iOS需要這樣設置下,啟用Generic Value Type Sharing
2.基本教程
參考
主要是CrossSettings.Current對象和它的2個函數GetValueOrDefault、AddOrUpdateValue,這2個函數的功能看名字應該就非常清楚了。
// 從設置中獲取指定Key的值,並轉換成相應的類型。
GetValueOrDefault<T>(string key);
// 向設置中添加制定key的值,如果已存在key則是更新當前值。
AddOrUpdateValue<T>(string key,T value);
設置的生命周期與應用程序一樣,當應用程序被卸載時清空。
三、實例
1.新建工程
- 在剛剛的Binding Project的解決方案中新建一個iOS的SingleView工程,工程名為EAintroView.Sample。
2.添加引用
- 通過Edit References引用綁定工程。
- 通過Nuget引用Settings插件
3.修改EAIntroView_SampleViewController文件如下:
using System;
using UIKit;
using Refractored.Xam.Settings;
using Refractored.Xam.Settings.Abstractions;
using CoreGraphics;
namespace EAIntroView.Sample
{
public partial class EAIntroView_SampleViewController : UIViewController
{
public EAIntroView_SampleViewController(IntPtr handle)
: base(handle)
{
}
/// <summary>
/// App設置
/// </summary>
/// <value>The app settings.</value>
private static ISettings AppSettings
{
get
{
return CrossSettings.Current;
}
}
public override void ViewDidLoad()
{
base.ViewDidLoad();
// Perform any additional setup after loading the view, typically from a nib.
//在主界面中添加一個UILabel用於區分
var label = new UILabel(new CGRect(0, 200, 320, 60));
label.Text = "這里是主界面哦~";
label.TextAlignment = UITextAlignment.Center;
label.Font = UIFont.SystemFontOfSize(40);
this.View.AddSubview(label);
//通過Setting獲取啟動次數,當第一次啟動的時候獲取到的值為0
var BootTimes = AppSettings.GetValueOrDefault<int>("BootTimes");
//第一個歡迎頁面,我們在上面顯示本次是第幾次啟動App
EAIntroPage page1 = new EAIntroPage();
page1.Title = "Page1";
page1.Desc = "Hello World Page1 no Description";
page1.BgColor = UIColor.Orange;
//在正常情況下我們可以通過判斷BootTimes的值來決定是否顯示歡迎界面
if (BootTimes <= 0)
{
page1.Desc = "你是第一次啟動哦~~~";
}
else
{
page1.Desc = string.Format("本次是你第{0}次啟動本程序", BootTimes);
}
EAIntroPage page2 = new EAIntroPage();
page2.Title = "Page2";
page2.Desc = "Hello World Page2 no Description";
page2.BgColor = UIColor.Red;
EAIntroPage page3 = new EAIntroPage();
page3.Title = "Page3";
page3.Desc = "Hello World Page3 no Description";
page3.BgImage = UIImage.FromBundle("Visual-Studio.jpg");
//歡迎界面
EAIntroView introView = new EAIntroView(this.View.Frame, new []{ page1, page2, page3 });
//顯示歡迎界面
introView.ShowInView(this.View);
//將啟動次數增加1,並保存在配置文件中
AppSettings.AddOrUpdateValue("BootTimes", ++BootTimes);
}
}
}
效果如下:
當第一次運行時,第一個界面顯示首次運行本程序,當在后台關閉程序后再打開界面會顯示是第二次打開本程序。
有關EAIntroView的詳細配置請參考Github的原項目,樣式還是挺多的。
四、總結
本文主要描述了
- Settings插件的使用
- 綁定了一個叫EAintroView的iOS第三方庫
- 利用以上2點制作了一個簡單歡迎界面
相關源代碼在 https://github.com/unhappy224/EAIntroViewSharp
如有疑問可以寫在評論中,或者聯系我:unhappy224#163.com QQ:104228916
歡迎加入QQ群:230865920
我第一次用Markdown寫博客,不知道為什么博客園的Markdown這么丑,大家可以看https://github.com/unhappy224/EAIntroViewSharp效果好一些