投稿日:

[Xamarin.Forms] SearchBarでプレースホルダの色を設定するには？

SearchHolderのプレースホルダの色を設定するには PlaceholderColor プロパティを使用します。

以下はXamlにおける PlaceholderColor プロパティの使用例です（12行目）。

<?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:searchBarSample03"
    x:Class="searchBarSample03.MainPage"
    xmlns:ios="clr-namespace:Xamarin.Forms.PlatformConfiguration.iOSSpecific;assembly=Xamarin.Forms.Core"
    ios:Page.UseSafeArea="true">
    
    <StackLayout>
        
        <SearchBar x:Name="searchBar" Placeholder="検索文字列" PlaceholderColor="Red" />
        
    </StackLayout>
</ContentPage>

コードで プレースホルダの色を設定するには、以下のようにします。

namespace searchBarSample03
{
  public partial class MainPage : ContentPage
  {
      public MainPage()
      {
          InitializeComponent();

          searchBar.Placeholder = "検索文字列";
          searchBar.PlaceholderColor = Color.Red;
      }
  }
}

実行例を以下に示します。

 

投稿日:

[Xamarin.Forms] SearchBarでプレースホルダを設定するには

SearchBar にはプレースホルダを設置することができます。

プレースホルダを設定するには Placeholder プロパティを使用します。

以下はXamlにおける Placeholder プロパティの使用例です（11行目）。

<?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:searchBarSample02" x:Class="searchBarSample02.MainPage"
    xmlns:ios="clr-namespace:Xamarin.Forms.PlatformConfiguration.iOSSpecific;assembly=Xamarin.Forms.Core"
    ios:Page.UseSafeArea="true">
    
    <StackLayout HorizontalOptions="CenterAndExpand">
    
        <SearchBar x:Name="searchBar" Placeholder="検索文字列を入力してください" />
        
    </StackLayout>
</ContentPage>

コードで SearchBarコントロールにプレースホルダ設定するには、以下のようにします。

namespace searchBarSample02
{
    public partial class MainPage : ContentPage
    {
        public MainPage()
        {
            InitializeComponent();

            searchBar.Placeholder = "検索文字列を入力してください";
        }
    }
}

実行例を以下に示します。

 

投稿日:

[Xamarin.Forms] SearchBarを使用するには？

はじめに

今回は、Xamarin.Formsで検索窓を設置する方法を説明します。

検索窓はSearchBarコントロールを使用します。

XamlによるSearchBarの設置とテキストの表示

検索窓に入力された文字の取得や表示は Text プロパティを使用します。

以下はXamlにおける SearchBar コントロールの使用例です（10行目）。

検索窓を設置するとともに、「ビルゲイツ」というテキストを表示しています。

<?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:searchBarSample01" 
              x:Class="searchBarSample01.MainPage"
              xmlns:ios="clr-namespace:Xamarin.Forms.PlatformConfiguration.iOSSpecific;assembly=Xamarin.Forms.Core"
              ios:Page.UseSafeArea="true">
    <StackLayout HorizontalOptions="CenterAndExpand">

        <SearchBar x:Name="searchBar" Text="ビルゲイツ"/>

    </StackLayout>
</ContentPage>

コードによる表示テキストの設定

コードで SearchBarコントロールにテキストを設定するには、以下のようにします。

namespace searchBarSample01
{
    public partial class MainPage : ContentPage
    {
        public MainPage()
        {
            InitializeComponent();

            this.searchBar.Text = "ビルゲイツ";
        }
    }
}

実行例を以下に示します。