[Tips] Xamarin.Forms 由程式端呼叫出Picker選單

*Note 以下內容為Xamarin Forms,跨平台部分,專案使用的是PCL

一般狀況來說,要使用像是在Windows Form上面,類似於ComboBox的下拉選單功能時,會使用Picker這個控制項來做,加到畫面上之後,就可以達成效果;但是預設的外觀有時候沒有辦法(或是比較難)去達到客製化,因此會需要一些繞道的方式。下面這邊簡單說一下筆者使用的方式。

目標

顯示一段租體文字,文字右側有一個向下的箭頭圖案,像是這樣 

XAML

XAML的部分想法上大致是
1.放一個Label作為主要的文字顯示
2.放一個Width為0的Picker來做選單的功能
3.加上一個Image做箭頭圖案的顯示
4.Image加上GestureRecognizers,來捕捉點選的動作

內容節錄大致如下

 <Label TextColor="Green" FontSize="18" FontAttributes="Bold" 
     VerticalOptions="Center" HorizontalOptions="Center" Text="------" 
     x:Name="labName" />
        <Picker x:Name="optName" />
        <StackLayout VerticalOptions="Center" HorizontalOptions="Center" 
           WidthRequest="16" HeightRequest="16">
          <Image Aspect="AspectFit" Source="pic_01.png"  VerticalOptions="Center" 
             HorizontalOptions="Center">
            <Image.GestureRecognizers>
              <TapGestureRecognizer Tapped="optNameClick"/>
            </Image.GestureRecognizers>
          </Image>
        </StackLayout>

Code

設定Picker寬度為0
optNameId.WidthRequest = 0;
而在optRoomIsClick的事件中,加入下面程式碼
void optNameClick(object sender, EventArgs e)
        {
            Device.BeginInvokeOnMainThread(() =>
            {
                optName.Focus();
            });
            
        }
*只要呼叫Picker的Focus,就可以達到呼叫出選單的功能,但是必須確保呼叫的時候,是在主要的UI執行續上面,相關的討論,可以參考一下這篇文章

這樣就可以偽裝一下,達到預期中的效果了。矬劣的方式給大家參考,如果有更佳的方式,也請不吝提供一下參考資訊,感謝 :)

留言

這個網誌中的熱門文章

開啟cshtml檔案時,出現『並未將物件參考設定為物件執行個體』的錯誤訊息

無法設定中斷點 尚未載入符號檔

DataGridView欄位計算總合