読者です 読者をやめる 読者になる 読者になる

tmytのらくがき

個人の日記レベルです

Continuum for Phone をStateTriggerで判別してみたよ

Windows 10時代のUWPは画面幅を中心にUIを考えろ。というガイドラインですが、やっぱ電話は片手で、PCは広い画面で。でもContinuum for PhoneしたときはPCみたいな広い画面で使いたいわけです。 でもって、Continuum for Phoneしてる時でもDeviceFamilyはMobileなのでそこんところを考慮していろいろやるとこういうXAMLができました。

Continuum for PhoneだとContinuum。電話で表示するとMobile。PCで広い画面だとWide。狭い画面だとNarrow。が表示されるXAMLです。

画面の広い、狭いはAdaptiveTriggerで。それ以外の2個はカスタムのStateTriggerを使ってます。それぞれの実装はこんな感じ。

条件の厳しいものから上にならべるとうまくいきます。実際はContinuumStateTriggerをちょっとカスタムして、Mobileで非Continuum状態というStateTriggerにしてMobileを判定。それ以外は画面幅にフォールバックとかがPCとContinuum for Phone で同じレイアウト、電話だけ違うレイアウトがやりやすいと思います。