Xamarin XAML語言教程隱藏檔案使用Progress屬性設定進度條

Xamarin XAML語言教程隱藏檔案使用Progress屬性設定進度條

Xamarin XAML語言教程隱藏檔案中使用Progress屬性設定進度條進度，開發者除了可以在XAML中使用Progress屬性設定進度條的當前進度外，還可以在程式碼隱藏檔案中使用Progress屬性來設定進度條的當前進度。這時，首先需要在XAML檔案中，使用x:Name屬性為進度條定義一個名稱，然後在程式碼隱藏檔案中通過定義的名稱對Progress屬性進行設定即可。

【示例12-7：ProgressBarProgressOne】以下將在程式碼隱藏檔案中實現對進度條當前進行的設定。具體的操作步驟如下：

（1）MainPage.xaml檔案，編寫程式碼，對內容頁面進行佈局。程式碼如下：

<?xml version="1.0" encoding="utf-8" ?>

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"

             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"

             xmlns:local="clr-namespace:ProgressBarProgressOne"

             x:Class="ProgressBarProgressOne.MainPage">

  <StackLayout Spacing="55"

             VerticalOptions="Center">

    <ProgressBar x:Name="progressBar" />

    <StackLayout Spacing="10">

      <Button Text="20%的進度"

              Clicked="SetProgressPointTwo"/>

      <Button  Text="60%的進度"

              Clicked="SetProgressPointSix"/>

      <Button  Text="100%的進度"

              Clicked="SetProgressOne"/>

    </StackLayout>

  </StackLayout>

</ContentPage>

（2）開啟MainPage.xaml.cs檔案，編寫程式碼，實現通過按鈕控制進度條當前進度的功能。程式碼如下：

using System;

using System.Collections.Generic;

using System.Linq;

using System.Text;

using System.Threading.Tasks;

using Xamarin.Forms;

namespace ProgressBarProgressOne

{

    public partial class MainPage : ContentPage

    {

        public MainPage()

        {

            InitializeComponent();

        }

        //將進度條當前的進度設定為0.2

        void SetProgressPointTwo(object sender, EventArgs args)

        {

            progressBar.Progress = 0.2;

        }

//將進度條當前的進度設定為0.6

        void SetProgressPointSix(object sender, EventArgs args)

        {

            progressBar.Progress = 0.6;

        }

//將進度條當前的進度設定為1

        void SetProgressOne(object sender, EventArgs args)

        {

            progressBar.Progress = 1;

        }

    }

}

此時執行程式，會看到如圖12.24~12.25所示的效果。當開發者輕拍某一按鈕後，會看到進度條中顯示對應的進度，效果類似於圖12.26~12.27所示。

圖12.24  Android的執行效果                     圖12.25  iOS的執行效果

圖12.26  Android的執行效果                    圖12.27  iOS的執行效果

來自 “ ITPUB部落格 ” ，連結：http://blog.itpub.net/29597077/viewspace-2139117/，如需轉載，請註明出處，否則將追究法律責任。