Open2

MAUI Tips

y_a_yy_a_y

Enumの値によってコントロールの表示を切り替える

    public enum LoadingState
    {
        Ready,
        Loading,
        Loaded,
        Error
    }

A) コンバーター

<ContentPage.Resources>
    <ResourceDictionary>
        <behaviors:EnumToBoolConverter x:Key="StatusConverter" />
    </ResourceDictionary>
</ContentPage.Resources>

<Label Text="{Binding ErrorMessage}" 
       TextColor="Red"
       IsVisible="{Binding State, Mode=OneWay, Converter={StaticResource StatusConverter}, ConverterParameter=Error}" />

B) VMで表示用のフラグを持つ

        [ObservableProperty]
        private State state = LoadingState.Ready;
        public bool HasError => State == LoadingState.Error;
        partial void OnStateChanged(LoadingState value)
        {
            OnPropertyChanged(nameof(HasError));
        }
<Label Text="{Binding ErrorMessage}" 
       TextColor="Red"
       IsVisible="{Binding HasError, Mode=OneWay}" />
y_a_yy_a_y

localhostの指定方法

前提

  • Web API は Windows PC 上で http://localhost:5000 などで起動している。
  • MAUI アプリは以下のいずれかのターゲットで動作:
    • Windows
    • Android(エミュレータ or 実機)
    • iOS(シミュレータ or 実機)

ターゲット別の接続先指定方法

MAUI on Windows

  • 接続先http://localhost:5000
  • 理由:MAUIアプリも同じPC上で動作しているため、localhost はPC自身を指す。

MAUI on Android Emulator

  • 接続先http://10.0.2.2:5000
  • 理由:Android Emulator の localhost はエミュレータ自身。ホストPCにアクセスするには 10.0.2.2 を使う。

MAUI on Android 実機

  • 接続先http://<PCのIPアドレス>:5000(例:http://192.168.1.100:5000
  • 条件
    • PCとスマホが同じWi-Fiネットワークに接続されていること
    • Windowsファイアウォールでポート(例:5000)を許可していること

MAUI on iOS Simulator(Mac)

  • 接続先http://localhost:5000 または http://127.0.0.1:5000
  • 条件:Web API が Mac 上で起動している場合

※ Windows PC 上のAPIにアクセスしたい場合は、MacからPCのIPアドレスを使う必要がある。


MAUI on iOS 実機

  • 接続先http://<PCのIPアドレス>:5000
  • 条件
    • iPhoneとPCが同じネットワークにいること
    • PCのファイアウォールでポートを許可