「名前」を入力し「自己紹介する」ボタンをクリックする自己紹介アプリです。
ファイル --> 新規作成 --> プロジェクト(P)... --> Cross-Platform --> Xamarin-Forms で作成
プロジェクト XFContenPageを右クリック --> 追加(D) --> 新しい項目(W)...をクリック
Cross-Platform --> code --> Forms Xaml Page を選択 名前:HomePage 追加
HomePage.xamlを書き換える。
HomePage.xaml
<?xml version="1.0" encoding="utf-16" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="XFPart2LBE02.HomePage">
<StackLayout>
<!-- 名前入力欄 -->
<Entry x:Name="MainEntry"/>
<!-- 自己紹介ボタン -->
<Button Clicked="Button_OnClicked"
Text="自己紹介する"/>
<!-- 自己紹介表示ラベル -->
<Label x:Name="MainLabel"/>
</StackLayout>
</ContentPage>
HomePage.xaml.csを書き換える。
HomePage.xaml.csにボタンクリック記述を追加する。
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Xamarin.Forms;
namespace XFPart2LBE02
{
public partial class HomePage : ContentPage
{
public HomePage()
{
InitializeComponent();
}
// 自己紹介ボタン
private void Button_OnClicked(object sender, EventArgs
e)
{
// 名前入力
string text = MainEntry.Text;
// 自己紹介テキスト
MainLabel.Text = "私は" + text +
"です。";
}
}
}
App.cs MainPageの書き換え
App.cs
this.MainPage = new Page1(); 1行のみ
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using Xamarin.Forms;
namespace XFPart2LBE02
{
public class App : Application
{
public App()
{
// The root page of your
application
MainPage = new HomePage();
//MainPage = new ContentPage
//{
// Content = new
StackLayout
// {
// VerticalOptions =
LayoutOptions.Center,
// Children =
{
// new
Label {
//
HorizontalTextAlignment = TextAlignment.Center,
//
Text = "Welcome to Xamarin Forms!"
//
}
// }
// }
//};
}
/// <summary>
protected override void OnStart()
{
// Handle when your app starts
}
/// <summary>
protected override void OnSleep()
{
// Handle when your app sleeps
}
/// <summary>
protected override void OnResume()
{
// Handle when your app resumes
}
}
}
ビルド
「自己紹介する」ボタンをクリック
「私がmaedaです。」が表示されます。
▫️参考ページ
Xamarin.Forms を XAML を使って書くために
Xamarin Forms with Visual Studio Part 2 [Label, Button, Entry]
コメントをお書きください