\

Xamarin で ListViewを使う方法

Xamarinは iOSやAndroidなどのスマホアプリが作れるフレームワークです。

画面viewをXAMLで記述して、処理をc#で記述します。

この記事では、XamarinでListViewを使う方法を紹介します。

1. XAML部分

以下のようにListViewを定義します。

1
2
<ListView x:Name="TopTaskView" ItemTapped="TopTaskView_ItemTapped" HasUnevenRows="False" RowHeight="40">
</ListView>
  • x:Name="TopTaskView"で、このListViewの名前をTopTaskViewとするように定義します。

  • ItemTapped="TopTaskView_ItemTapped"で ListView のアイテムをタップしたときのイベントトリガーを定義します。TopTaskView_ItemTappedという関数が実行されます。

  • HasUnevenRows="False" は、RowHeightプロパティと併用すると、リストビューには値のある行しか表示されません。HasUnevenRowsRowHeightプロパティを定義しない場合、リストビューに空行のアイテムが表示されます。

2. コード部分

以下のコードで、ListView(TopTaskView)に値をセットします。

1
2
3
4
5
6
TopTaskView.ItemsSource = new string[]
{
"item 1111111111111",
"item 2222222222222",
"item 3333333333333",
};

TopTaskView_ItemTappedイベントは、タップしたアイテム名がアラートで表示されるようにしています。

以下のように、e.Item.ToString()で、タップしたアイテム名を取得します。

1
2
3
4
void TopTaskView_ItemTapped(System.Object sender, Xamarin.Forms.ItemTappedEventArgs e)
{
await DisplayAlert("title", e.Item.ToString(), "ok");
}

3. 実行結果

以下のように表示されれば成功です。

4. ソースコード全文

今回のソースコードの全文を記載します。

  • MainPage.xaml
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<?xml version="1.0" encoding="utf-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="todotimer.MainPage">
<StackLayout>
<Label Text="Todo Timer" HorizontalTextAlignment="Start" FontSize="24" />
<Label Text="Today's Task" HorizontalTextAlignment="Start" FontSize="24" />
<ScrollView>
<StackLayout>
<ListView x:Name="TopTaskView" ItemTapped="TopTaskView_ItemTapped" HasUnevenRows="False" RowHeight="40">
</ListView>
</StackLayout>
</ScrollView>


</StackLayout>
</ContentPage>
  • MainPage.xaml.cs
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Xamarin.Forms;

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

TopTaskView.ItemsSource = new string[]
{
"item 1111111111111",
"item 2222222222222",
"item 3333333333333",
};

}

void TopTaskView_ItemTapped(System.Object sender, Xamarin.Forms.ItemTappedEventArgs e)
{
await DisplayAlert("title", e.Item.ToString(), "ok");

}
}
}

コメントシステムを導入しました!コメント頂けると嬉しすぎて、光の速さで返信します(●´ω`●)

ExecNote.app リリースしました!

ExecNoteは、コードが実行できるMarkdownアプリケーションです。Markdownドキュメント内に記載したコードをクリックすると実行ができます。わざわざターミナルを 起動させる必要がありません!無料ですのでもしよければダウンロードをお願いします。

About Me

11年目のシステムエンジニアです。アプリで生活や仕事を改善したい🐱仕事効率化、自動化のアプリ開発が得意です、ご相談ください。 🚀エンタメ系アプリの開発も模索中🐬社内SEや個人アプリ開発者、システムエンジニアになりたい人と繋がりたい🐱