shuhelohelo’s blog

Xamarin.Forms多めです.

Xamarin.Google.Android.Material Version="1.0.0-rc1"を導入したときのEntryなどの挙動の違い

以下のサンプルアプリを実行したとき,Entryの見た目と挙動が違っていたので,どういう仕組なのか色々調べた結果.

github.com

どんな挙動かというと以下のとおり.

f:id:shuhelohelo:20200502084704g:plain

Entryに背景色がついていて,focusが当たると色が変わる.

これはVisual="Material"としただけでは得られない挙動.

Visual="Material"を指定したときの挙動はこう.

f:id:shuhelohelo:20200502090927g:plain

Visual="Material"を指定しただけでは,focus時に背景色は変わらないし,focus時の背景色を指定するプロパティだってない.

カスタムレンダラーとかEffectとかVisualStateManagerとか,またはサードパーティのUIライブラリを使っているのかな,と思ったら使っていなかった.

                <Entry
                    Grid.Row="1"
                    Grid.Column="1"
                    Keyboard="Text"
                    Placeholder="First name"
                    Style="{DynamicResource EntryStyle}"
                    Text="{Binding FirstName}" />

素のEntryだったし,Styleに指定しているEntryStyleにひみつがあるのかと思いきやこれまた特別なことはしていない.

            <Style x:Key="EntryStyle" TargetType="Entry">
                <Setter Property="Visual" Value="Material" />
                <Setter Property="BackgroundColor" Value="{DynamicResource EntryBackgroundColor}" />
                <Setter Property="TextColor" Value="{DynamicResource SystemGray}" />
                <Setter Property="PlaceholderColor" Value="{DynamicResource AccentColor}"/>
            </Style>

しかも,Entryに限らずDatePickerやTimePickerなど基本的な入力系のUIは同じ挙動になっている.

結論としてはこの挙動はXamarin.Google.Android.MaterialというパッケージをAndroidプロジェクトにインストールしていることによるものだった.バージョンは1.1.0-rc2.安定版の1.0.0ではいつもどおり.

f:id:shuhelohelo:20200502090030p:plain

これがインストールされているとUIの挙動が前述のとおりになる.

選択中のEntryがわかりやすいから,いいなと思うけれど,プレースホルダーが見えなくなってしまうのが困る.

これはまだ安定版じゃないから挙動がおかしいのか,それとも正しいのかわからない.

インストール

AndroidプロジェクトのReferencesで右クリックしてManage Nuget Packagesを選択する.

f:id:shuhelohelo:20200502091154p:plain

Xamarin.Google.Android.Materialを検索して,バージョン1.1.0-rc1以上を選択してインストールする.

f:id:shuhelohelo:20200502091616p:plain

そしてビルドすると以下のパッケージをインストールしろと言われるので,

- Xamarin.AndroidX.Lifecycle.LiveData
- Xamarin.AndroidX.Browser
- Xamarin.AndroidX.Legacy.Supportv4

AndroidプロジェクトにNugetでインストールするか,Androidプロジェクトの.csprojファイルに以下のように追記する.

    <PackageReference Include="Xamarin.AndroidX.Lifecycle.LiveData" Version="2.2.0" />
    <PackageReference Include="Xamarin.AndroidX.Browser" Version="1.2.0" />
    <PackageReference Include="Xamarin.AndroidX.Legacy.Support.V4" Version="1.0.0" />

参照

Xamarin.Google.Android.Materialに関しては以下のページに説明されているようだけれど,しっかり読んでいない.AndroidX絡みのようだ.

docs.microsoft.com