質問編集履歴

1 タイトルのタイポ修正

toshi0607

toshi0607 score 55

2017/02/15 23:38  投稿

Xamarin.FormsのTabbedPageで別ファイルに定義したContentPageの読み込み方についえ
Xamarin.FormsのTabbedPageで別ファイルに定義したContentPageの読み込み方について
# 概要
Xamarin.FormsのTabbedPageで別ファイルに定義したContentPageの読み込む際、`XML名がXML名前空間の仕様に準拠していません`、`Type mypage:StocksPage not found in xmlns clr-namespace:StockIO.View;assembly=StockIO.View`となりTabbedPageと別ファイルで定義しているContentPageを読み込むことができずに困っています。
# 詳細
* StockIO/View/TopTabbedPage.xaml
```xaml
<?xml version="1.0" encoding="utf-8" ?>
<TabbedPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:mypage="clr-namespace:StockIO.View;assembly=StockIO.View"
x:Class="StockIO.View.TopTabbedPage">
<TabbedPage.Children>
<mypage:StocksPage Title="管理"/>
</TabbedPage.Children>
</TabbedPage>
```
* StockIO/View/TopTabbedPage.xaml.cs
```C#
using Xamarin.Forms;
namespace StockIO.View
{
public partial class TopTabbedPage : TabbedPage
{
public TopTabbedPage()
{
InitializeComponent();
}
}
}
```
* StocIO/View/StocksPage.xaml
```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="StockIO.View.StocksPage"
Title="Stocks">
<StackLayout Spacing="0">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<Button Text="Sync Stocks" Command="{Binding GetStocksCommand}"/>
<StackLayout Grid.Column="1" Orientation="Horizontal" HorizontalOptions="StartAndExpand">
<Button x:Name="CreateButton"
Text="アイテム追加"
MinimumHeightRequest="30"
Clicked="OnAdd" />
</StackLayout>
</Grid>
<ActivityIndicator IsRunning="{Binding IsBusy}" IsVisible="{Binding IsBusy}"/>
<ListView x:Name="ListViewStocks"
ItemsSource="{Binding Stocks}">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="20"></RowDefinition>
<RowDefinition Height="20"></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"></ColumnDefinition>
<ColumnDefinition Width="120"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Label Grid.Row="0" Grid.RowSpan="2" Grid.Column="0" Font="Large" Text="{Binding Name}" LineBreakMode="TailTruncation"></Label>
<Label Grid.Row="0" Grid.Column="1" Text="{Binding Amount, StringFormat='あと{0}個'}"></Label>
<Label Grid.Row="1" Grid.Column="1" Text="{Binding ThresholdAmount, StringFormat='残り{0}個でお知らせ'}"></Label>
</Grid>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackLayout>
</ContentPage>
```
* StocIO/View/StocksPage.xaml.cs
```c#
using Xamarin.Forms;
using StockIO.ViewModel;
using StockIO.Model;
namespace StockIO.View
{
public partial class StocksPage : ContentPage
{
StocksViewModel vm;
public StocksPage()
{
InitializeComponent();
vm = new StocksViewModel();
BindingContext = vm;
ListViewStocks.ItemSelected += ListViewStocks_ItemSelected;
CreateButton.Clicked += OnAdd;
}
protected override async void OnAppearing()
{
vm.GetStocksCommand.Execute("");
}
private async void ListViewStocks_ItemSelected(object sender, SelectedItemChangedEventArgs e)
{
var stock = e.SelectedItem as Stock;
if (stock == null)
return;
await Navigation.PushAsync(new StockEditPage(stock));
ListViewStocks.SelectedItem = null;
}
private async void OnAdd(object sender, EventArgs e)
{
var stock = new Stock();
await Navigation.PushAsync(new StockEditPage(stock));
}
}
}
```
# 参考にしたページ
* [Common UI Patterns in Xamarin Forms – Part 2 – Tabbed Pages](http://www.kymphillpotts.com/common-ui-patterns-in-xamarin-forms-part-2-tabbed-pages/)
* [TabbedPage と NavigationPage を組み合わせて使うには](http://ytabuchi.hatenablog.com/entry/2016/05/30/210000)
# 動作環境
・Xamarin.Forms 2.3.3.180
・Visual Studio2015 pro
・Windows10
よろしくお願いします。
  • XAML

    330 questions

    XAML(Extensible Application Markup Language)はWPF、Silverlight、Windows PhoneそしてWindows Store appsでユーザーインターフェースを定義するために使われるXML言語です。

  • Xamarin

    684 questions

    Xamarin(ザマリン)は、iPhoneなどのiOSやAndroidで動作し、C# 言語を用いてアプリを開発できるクロスプラットフォーム開発環境です。Xamarin Studioと C# 言語を用いて、 iOS と Android の両方の開発を行うことができます。

思考するエンジニアのためのQ&Aサイト「teratail」について詳しく知る