質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

89.22%

Xanarin.AndroidのDisplayAlertに今貼っている画像のようにしたい

解決済

回答 2

投稿 編集

  • 評価
  • クリップ 1
  • VIEW 297

GId

score 11

イメージ説明

Xanarin.Androidのチェックボックスで複数選択したモノをDisplayAlertで表示する

該当のソースコード

C#
Xamarin.Android

補足情報(FW/ツールのバージョンなど)

Visual Studio 2019
Xamarin.Android

  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

回答 2

checkベストアンサー

+1

絵を描いていただいたので、やりたいことがとても良く分かるようになりました。ありがとうございます。

DisplayAlert にこだわらない方がよいと私は思います。階層ナビゲーション にすることを提案します。

ちょっとその前に、データのクラスを用意します。

public class Item
{
    public string Name { get; set; }
    public decimal Price { get; set; }
    public bool IsSelected { get; set; }
    public int Count { get; set; }
}

最初のページを NavigationPage で包んでおきます。

public App()
{
    InitializeComponent();

    MainPage = new NavigationPage(new MainPage());
}


MainPage、Page1、Page2 を以下のように用意します。

MainPage

MainPage

  • 開始ボタンが押されたら、データを作って Page1 に渡して、PushAsync でページ遷移します。
<ContentPage
(略)
    <StackLayout>
        <Button Text="開始" Clicked="Start_Clicked" />
    </StackLayout>
</ContentPage>
public partial class MainPage : ContentPage
{
    public MainPage()
    {
        InitializeComponent();
    }

    private async void Start_Clicked(object sender, EventArgs e)
    {
        // データを準備します。
        var items = new List<Item>();

        var coffee = new Item()
        {
            Name = "コーヒー",
            Price = 600
        };
        items.Add(coffee);
        var ehomaki = new Item()
        {
            Name = "恵方巻",
            Price = 500
        };
        items.Add(ehomaki);
        var roast = new Item()
        {
            Name = "ロースト",
            Price = 700
        };
        items.Add(roast);

        // データを渡してページ1へ遷移します。
        await Navigation.PushAsync(new Page1(items));
    }
}

Page1

Page1

  • ListView を使ってデータを表示することにします。ListView のセルは、中にいろいろ作りこめる ViewCell にします。データをビューに反映するためにデータ バインディングを使っています。
  • 次へボタンが押されたら、選択されているものだけを Page2 に渡して、PushAsync でページ遷移します。
  • 画面左上の「←」で前のページに戻ることもできます。
<ContentPage
(略)
    <StackLayout>
        <ListView x:Name="ListView1">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <ViewCell>
                        <StackLayout Orientation="Horizontal">
                            <CheckBox IsChecked="{Binding IsSelected}" />
                            <Label Text="{Binding Name}" />
                        </StackLayout>
                    </ViewCell>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
        <Button Text="次へ" Clicked="Next_Clicked" />
    </StackLayout>
</ContentPage>
public partial class Page1 : ContentPage
{
    // データ
    public IEnumerable<Item> Items { get; set; }

    public Page1(IEnumerable<Item> items)
    {
        InitializeComponent();

        // データを ListView に渡します。
        ListView1.ItemsSource = Items = items;
    }

    // 次へボタン
    private async void Next_Clicked(object sender, EventArgs e)
    {
        // 1つ以上が選択されていること。
        if (!Items.Any(x => x.IsSelected))
            return;

        // 選択されているものだけを渡して、ページ2へ遷移します。
        await Navigation.PushAsync(new Page2(Items.Where(x => x.IsSelected)));
    }
}

Page2

Page2

  • ここも ListView です。個数の入力はとりあえず Entry にしました。
  • 注文確定ボタンが押されたら、何らかの処理をしたいのですが、とりあえず注文内容を DisplayAlert で表示します。SQLite については、すみませんが割愛します。その後、PopToRootAsync で一気に MainPage に戻ります。
  • ここでも画面左上の「←」で1つ前のページに戻ることができます。
<ContentPage
(略)
    <StackLayout>
        <ListView x:Name="ListView2">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <ViewCell>
                        <Grid>
                            <Label Grid.Row="0" Grid.Column="0" Text="{Binding Name}" />
                            <Label Grid.Row="0" Grid.Column="1" Text="{Binding Price}" />
                            <Entry Grid.Row="0" Grid.Column="2" Text="{Binding Count}" Keyboard="Numeric" />
                        </Grid>
                    </ViewCell>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
        <Button Text="注文確定" Clicked="Submit_Clicked" />
    </StackLayout>
</ContentPage>
public partial class Page2 : ContentPage
{
    // データ
    public IEnumerable<Item> Items { get; set; }

    public Page2(IEnumerable<Item> items)
    {
        InitializeComponent();

        // データを ListView に渡します。
        ListView2.ItemsSource = Items = items;
    }

    private async void Submit_Clicked(object sender, EventArgs e)
    {
        // 個数がすべて入力されていること。
        if (!Items.All(x => x.Count > 0))
            return;

        var stringBuilder = new StringBuilder();
        foreach(var item in Items)
        {
            stringBuilder.Append($"{item.Name} × {item.Count} コ\n");
        }
        await DisplayAlert("注文内容", stringBuilder.ToString(), "OK");

        // 最初に戻ります。
        await Navigation.PopToRootAsync();
    }
}

以上となります。これ以外にも様々な実装があり得ると思います。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2020/04/16 15:10

    アクセシビリティに一貫性がありません と言われます。
    どうしたらよいでしょうか?

    キャンセル

  • 2020/04/16 15:19

    Item クラスに public を付け忘れていませんか。あるいは他のどこかに public が抜けている。

    キャンセル

  • 2020/04/16 15:23

    消えました。
    Itemクラスに付け忘れていたようです。

    これで、今止まっている作ってい見たいモノを進められそうです。
    回答本当にありがとうございます!!

    キャンセル

0

DisplayAlertは単純なテキスト以外を表示できません。
カスタムビューを実装しましょう。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 89.22%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる