10日 5月 2016

Xamarin.Froms ListView レイアウト編集

「名前」「年齢」を表示するListViewのレイアウト編集。

Androidエミレーター表示

ファイル --> 新規作成 --> プロジェクト(P)... --> Cross-Platform --> Xamarin-Forms で作成

Pasonクラスの作成

プロジェクト XFContenPageを右クリック --> 追加(D) -->クラス(C)...をクリック

Visual C# --> クラスを選択名前:Pason を追加

Pasonクラスにリスト項目の名前：Name 年齢：Age を記述する。

Pason.cs 名前：Name 年齢：Age を記述する。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace XFPart9LBE01
{
class Parson
{

public String Name { get; set; }

public int Age { get; set; }

}
}

プロジェクト XFContenPageを右クリック --> 追加(D) --> 新しい項目(W)...をクリック

Cross-Platform --> code --> Forms Xaml Page を選択名前:HomePage 追加

HomePage.xaml

Xamlのレイアウト編集

HomePage.xaml

<?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="XFPart9LBE01.HomePage"
BackgroundColor="White"
Title="Home Page">

<ListView x:Name="MainListView"
HasUnevenRows="True">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<StackLayout Orientation="Vertical">
<Grid BackgroundColor="White"
HeightRequest="1"/>
<StackLayout Orientation="Vertical"
Padding="10"
BackgroundColor="Purple">
<Label Text="{Binding Name}"
FontSize="24"/>
<Label Text="{Binding Age}"
FontSize="20"
Font="Bold"
Opacity="0.6"/>
</StackLayout>
</StackLayout>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>

</ContentPage>

HomePage.xaml.csを書き換える。

HomePage.xaml.csにPasonクラスのList一覧を記述する。

using System;

using System.Collections.Generic;

using System.Linq;

using System.Text;

using System.Threading.Tasks;

using Xamarin.Forms;

namespace XFPart9LBE01

{

public partial class HomePage : ContentPage

{

public HomePage()

{

InitializeComponent();

MainListView.ItemsSource = new List<Parson>

{

new Parson

{

Name = "山田",

Age = 26

new Parson

{

Name = "田中",

Age = 32

new Parson

{

Name = "坂本",

Age = 24

new Parson

{

Name = "鈴木",

Age = 70

new Parson

{

Name = "山口",

Age = 50

new Parson

{

Name = "大山",

Age = 30

new Parson

{

Name = "山本",

Age = 46

new Parson

{

Name = "本木",

Age = 50

new Parson

{

Name = "真田",

Age = 36

new Parson

{

Name = "徳川",

Age = 50

new Parson

{

Name = "三段",

Age = 56

new Parson

{

Name = "川口",

Age = 50

}

};

}

App.cs MainPageの書き換え

App.cs

MainPage = new HomePage(); １行のみ

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;

using Xamarin.Forms;

namespace XFPart9LBE01
{
public class App : Application
{
public App()
{
// The root page of your application
MainPage = new HomePage();
}

protected override void OnStart()
{
// Handle when your app starts
}

protected override void OnSleep()
{
// Handle when your app sleeps
}

protected override void OnResume()
{
// Handle when your app resumes
}
}
}