XAML in Xamarin.Forms 基礎篇 電子書

XAML in Xamarin.Forms 基礎篇 電子書
XAML in Xamarin.Forms 基礎篇 電子書

Xamarin.Forms 快速入門 電子書

Xamarin.Forms 快速入門 電子書
Xamarin.Forms 快速入門 電子書

2016/10/02

Xamarin.Forms Prism DelegateCommand 的更新狀態為是否可以使用

在建立 DelegateCommand 物件的時候,可以使用兩種建構式。其中,DelegateCommand(Action executeMethod) 只用來定義該命令要執行的內容,而這個 DelegateCommand(Action executeMethod, Func<bool> canExecuteMethod) 則可以定義何時這個命令可以使用。
        //
        // 摘要:
        //     Creates a new instance of Prism.Commands.DelegateCommand with the System.Action
        //     to invoke on execution.
        //
        // 參數:
        //   executeMethod:
        //     The System.Action to invoke when System.Windows.Input.ICommand.Execute(System.Object)
        //     is called.
        public DelegateCommand(Action executeMethod);
        //
        // 摘要:
        //     Creates a new instance of Prism.Commands.DelegateCommand with the System.Action
        //     to invoke on execution and a Func to query for determining if the command can
        //     execute.
        //
        // 參數:
        //   executeMethod:
        //     The System.Action to invoke when System.Windows.Input.ICommand.Execute(System.Object)
        //     is called.
        //
        //   canExecuteMethod:
        //     The System.Func`1 to invoke when System.Windows.Input.ICommand.CanExecute(System.Object)
        //     is called
        public DelegateCommand(Action executeMethod, Func<bool> canExecuteMethod);
在這裡,首先定義一個 DelegateCommand,並且產生兩個委派方法,而在 canExecuteMethod 委派方法,僅回傳 是否啟用
這個屬性 是否啟用 當有值設定的時候,會去呼叫 切換到新頁面Command.RaiseCanExecuteChanged(),也就是會同步更新按鈕是否可以使用。
        #region 是否啟用
        private bool _是否啟用=true;
        /// <summary>
        /// 是否啟用
        /// </summary>
        public bool 是否啟用
        {
            get { return this._是否啟用; }
            set { this.SetProperty(ref this._是否啟用, value); 切換到新頁面Command.RaiseCanExecuteChanged(); }
        }
        #endregion

        private readonly INavigationService _navigationService;
        public DelegateCommand 切換到新頁面Command { get; private set; } 

        public MainPageViewModel(INavigationService navigationService)
        {

            _navigationService = navigationService;
            切換到新頁面Command = new DelegateCommand(切換到新頁面, Can切換到新頁面);
        }

        private bool Can切換到新頁面()
        {
            return 是否啟用;
        }

        private void 切換到新頁面()
        {
            _navigationService.NavigateAsync("NewPage");
        }

2016/10/01

Xamarin.Android 解決 java.lang.UnsupportedClassVersionError: com/android/dx/command/Main : Unsupported major.minor version 52.0

可以嘗試底下方法來解決:
升級到 Java JDK 8,並且在 工具 > 選項 > Xamarin > Android Setting ,設定 Java JDK 8 的路徑
或者,從 Android SDK Manager 移除所有的 Android SDK Build-tools 24號以上版本套件

2016/09/30

那些 Android SDK 套件需要使用 Android SDK Manager 來安裝呢?

工具 Tools

您需要使用 Android SDK Manager 安裝底下套件到最新版本
  • Android SDK Tools
  • Android SDK Platform-Tools
  • Android SDK Build-Tools

Android 個別平台

在您想要使用的 Android 版本,需要安裝 SDK Platform 這個套件。
若您的 Target API 設定為 21,Minimum API 設定為 21,則,您僅僅需要安裝 API 21 的 SDK Platform 套件。
若您的 Target API 設定為 21,Minimum API 設定為 15,則,您僅僅需要安裝 API 15-21 的 SDK Platform套件。

系統影像檔 (System Images)

選擇安裝這些套件,將會安裝 Google 所提供的 Android 原生模擬器
如何規劃與設定預設模擬器,請參考
如何加速預設模擬器,請參考

額外 (Extras)

在 Android SDK Manager 的清單最後面,會有 Extras 項目,建議安裝底下項目
  • Android Support Repository
  • Google USB Driver

2016/09/29

Visual Studio Emulator for Android 疑難排解

請參考微軟官方的詳細說明與解決方案
https://msdn.microsoft.com/zh-tw/library/mt228282.aspx

XAML Preview 的操作過程

enter image description here


在 Android SDK Manager 移除了 Android SDK Tools 的解決方法

若您在 Visual Studio 2015 開啟了 Android SDK Manager,並且將 Android SDK ToolsAndroid SDK Platform-tools 移除了。
enter image description here
此時,系統會確認您是否有刪除這些套件。
enter image description here
下次,若您再度從 Visual Studio 內,想要開啟同樣的工具,Android SDK Manager,便會看到下圖的錯誤訊息
Command did not execute successfully due to an unexpected exception. Please check the output windows for additional information.
enter image description here
輸出 視窗內,會但到底下訊息:
[I:sdk]:                    Key HKCU\SOFTWARE\Novell\Mono for Android\AndroidSdkDirectory not found.
[I:sdk]:                    Key HKCU\SOFTWARE\Novell\Mono for Android\AndroidNdkDirectory found:
    Path contains ndk-stack in \. (C:\ProgramData\Microsoft\AndroidNDK\android-ndk-r10e\).
[I:sdk]:                    Key HKCU\SOFTWARE\Novell\Mono for Android\JavaSdkDirectory not found.
[I:sdk]:                  Looking for Android SDK..
[I:sdk]:                    Key HKCU\SOFTWARE\Novell\Mono for Android\AndroidSdkDirectory not found.
[I:sdk]:                    Key HKLM\SOFTWARE\Novell\Mono for Android\AndroidSdkDirectory found:
    Path does not contain adb in \platform-tools (C:\android-sdk-windows).
[I:sdk]:                    Key HKCU\SOFTWARE\Xamarin\MonoAndroid\PrivateAndroidSdkPath not found.
[I:sdk]:                    Key HKCU\SOFTWARE\Android SDK Tools\Path not found.
[I:sdk]:                    Key HKLM\SOFTWARE\Android SDK Tools\Path found:
    Path contains adb in \platform-tools (C:\Program Files (x86)\Android\android-sdk).
[I:sdk]:                    Key HKCU\SOFTWARE\Novell\Mono for Android\JavaSdkDirectory not found.
[I:sdk]:                    Key HKLM\SOFTWARE\Novell\Mono for Android\JavaSdkDirectory not found.
[I:sdk]:                  Looking for Java 6 SDK..
[I:sdk]:                    Key HKLM\SOFTWARE\JavaSoft\Java Development Kit\CurrentVersion found.
[I:sdk]:                    Key HKLM\SOFTWARE\JavaSoft\Java Development Kit\1.6\JavaHome not found.
[I:sdk]:                    Key HKLM\SOFTWARE\JavaSoft\Java Development Kit\1.7\JavaHome found:
    Path contains jarsigner.exe in \bin (C:\Program Files (x86)\Java\jdk1.7.0_55).
[I:Unknown]:              Found Android SDK. API levels: (none)
[I:Unknown]:              Found Xamarin.Android 7.0.1
請從控制台,找到 Android SDK Tools 將其移除
enter image description here
接著,在控制台新增/移除中,找到 Microsoft Visual Studio 2105 雙擊這個項目,當安裝程式跑完之後,點選 Modify
enter image description here
Android SDK [3rd Party] ,將其安裝起來,就可以了。
之後,就可以開啟 Visual Studio 2015,您會發現,您可以開啟了 Android SDK Manager
enter image description here

2016/09/28

使用 Xamarin.Forms XAML Previewer

enter image description here


終於在 Visual Studio 內,現在可以使用 XAML Previewer 功能了,也就是說,當您一邊撰寫 XAML 內容的時候,可以即時看到您的頁面呈現成果;雖然比起 WPF / UWP 的 Blend 所提供的功能還有相當大的一段落差,不過,這是 Xamarin.Forms 對於 XAML Previewer 相當大的進步。
順便一提,這次更新的 Xamarin for Visual Studio,對於 XAML IntelliSense的支援,也是有著相當大的進步,各位可以嘗試看看。

參考

https://developer.xamarin.com/guides/xamarin-forms/xaml/xaml-previewer/

升級到 Xcode8,Xamarin Mac Agent 無法連線到遠端Mac電腦

當您的 Visual Studio 的 Xamarin 套件升級到 4.2.0 版本,此時, Xamarin.iOS 的版本也升級到 10.0.0。
Xamarin.iOS10
當然,在 Mac 端,您也需要升級 Xcode & Xamarin Studio 應用程式。此時,回到 Windows 電腦上,開啟 Visual Studio 2015,接著想要使用 Xamarin Mac Agent 連線到遠端 Mac 電腦,卻會一直無法連線到 Mac電腦,但是當您使用 Putty 來測試這台 Windows 電腦,卻可以使用 SSH 協定遠端登入 Mac 電腦。
這個時候,Visual Studio 的 Connect to Mac 對話窗,有段警告訊息
Xcode license must be accepted in order to be connected and working against the Mac
ConnectToMac
請在 Mac 電腦上,開啟 Xcode 開發工具,會出現底下對話窗,您需要點選 Agree 同意按鈕。
XcodeAndiOSSDKLicense
此時,會出現 Installing components ... 對話窗,等候安裝完成。
InstallComponents
回到 Visual Studio ,繼續操作 Xamarin Mac Agent,就可連線到 Mac 電腦了

2016/09/27

如何在 Mac 電腦上升級 Xcode & Xamarin Studio

Xcode

當您 Mac 電腦上的 Xcode 有新版本推出的時候,App Store 會有提示,如下
AppStoreUpdate
此時,您可以開啟 App Store 這個應用程式,在 更新項目 頁次,可以看到有新版本的 Xcode 推出
AppStore更新項目
請點選右方的更新,就可以進行 Xcode 的開發工具更新。
之後,會出現底下對話窗,您需要輸入 Apple ID
登入來從AppStore下載
Xcode升級
升級完成後,會出現如下畫面
Xcode升級完成

Xamarin Studio

在 Mac 電腦上開啟 Xamarin Stdio 程式
點選功能表 Xamarin Studio Community > Check for Update...
XamarinStudio2的升級前
等候下載完成,點選 Restart and Install Updates

XamarinStudio2的升級前
XamarinStudio2的升級後

2016/09/26

Xamarin 導航工具列的使用與應用 ToolbarItem

想要在頁面中使用工具列功能,這個頁面必須是具備可導航的特性。
工具列的各個按鈕項目,可以使用 ContentPage.ToolbarItem 屬性項目 Property Element 來進行設定。
每個工具列中的按鈕使用 ToolbarItem 控制項來定義其功能
  • Command
    可以用於綁定 ViewModel 內的 ICommand 屬性,執行特定命令工作
  • Text
    這個工具列按鈕要顯示的文字
  <ContentPage.ToolbarItems>
    <ToolbarItem Command="{Binding 查看地圖Command}" Text="查看地圖" Order="Secondary" Priority="0" />
    <ToolbarItem Command="{Binding 撥打電話Command}" Text="撥打電話" Order="Secondary" Priority="0" />
    <ToolbarItem Command="{Binding 發送簡訊Command}" Text="發送簡訊" Order="Secondary" Priority="0" />
    <ToolbarItem Command="{Binding 發送電子郵件Command}" Text="發送電子郵件" Order="Secondary" Priority="0" />
    <ToolbarItem Command="{Binding 分享內容Command}" Text="分享內容" Order="Secondary" Priority="0" />
    <ToolbarItem Command="{Binding 分享連結Command}" Text="分享連結" Order="Secondary" Priority="0" />
    <ToolbarItem Command="{Binding 查看官網Command}" Text="查看官網" Order="Secondary" Priority="0" />
  </ContentPage.ToolbarItems>
若在定義工具列按鈕 ToolbarItem 的時候,想要在程式上顯示圖片代表這個按鈕,可以參考底下程式碼的作法;這是使用了 ToolbarItem.Icon 屬性項目(Property Element)來定義所代表的圖片,並且透過了OnPlatform 來針對不同平台下的圖片檔案所在位置。請特別注意,由於這些圖片檔案是位於每個作業系統平台專案內,因此,需要使用 x:TypeArguments="FileImageSource" 來指定這些圖片是存在於每個專案內的資源內。
+

    <ToolbarItem
      Command="{Binding 新增Command}"
      Text="新增"
      Order="Primary"
      Priority="0">
      <ToolbarItem.Icon>
        <OnPlatform x:TypeArguments="FileImageSource"
                     iOS="Add.png"
                     Android="Add.png"
                     WinPhone="Assets/Images/Add.png" />  
      </ToolbarItem.Icon>
    </ToolbarItem>

參考