記事一覧

Xamarinでラインを配置する方法 | Xamarin.Forms

 
Xamarin.Forms の Xaml にてライン(線)のコントロールオブジェクトを配置する方法をご紹介します。

尚、Xamarin.Formsにはラインコントロールがありませんので、 BoxView で代用します。


表示結果
Android5
line_01.png
iOS10
line_02.png


※ラインの色は Color.Gray で表示してあります。



前提条件
・Windows10
・Visual Studio 2015 Community Update3
・Xamarin 4.2.0.719 (NuGet Xamarin.Forms 2.3.2.127)
・macOS Sierra 10.12.1 / Xcode8.1 / Xamarin.iOS 10.2.0.4



1.Xaml にて BoxView を配置する。

Xaml
<BoxView x:Name="line1" />



2.C# にてプロパティを設定する。

C# ページのコンストラクタに記述します。
public SamplePage() : ContentPage
{
InitializeComponent();
line1.HeightRequest = 1;
line1.WidthRequest = 100;
switch (Device.OS)
{
case TargetPlatform.iOS:
    line1.BackgroundColor = Color.Black;
    break;
case TargetPlatform.Android:
    line1.BackgroundColor = Color.White;
    break;
default:
    line1.BackgroundColor = Color.White;
    break;
}
}

上記は水平ラインです。垂直ラインの場合は、HeightRequest と WidthRequest の値を入れ替えます。
以上でLineコントロールのようなオブジェクトを配置可能ですが、もっと簡単にできる方法が以下の方法となります。



3.派生クラスを作成する方法

または、次のようにBoxViewを継承したコントロールを作成して、プロパティ等を予め設定してしまう方法の方が簡単ですね。
BaseLine.cs
using Xamarin.Forms;
namespace AppName.Controls
{
[System.Diagnostics.DebuggerStepThrough()]
public class BaseLine : BoxView
{
public BaseLine() : base()
{
this.HeightRequest = 1;
this.WidthRequest = 100;
this.BackgroundColor = Color.Gray;
this.Margin = new Thickness(0, 10, 0, 10);
}

public Color LineColor {
get { return this.BackgroundColor; }
set { this.BackgroundColor = value; }
}
}
}

使用方法は1行のみで簡単です。
TestPage.xaml
<ContentPage xmlns:base="clr-namespace:AppName.Controls;assembly=AppName">
<base:BaseLine x:Name="line1" />
</ContentPage>

VB.NET で行っていた代替方法と同様ですね。
Lineオブジェクトぐらい標準で提供してもらいたいものです。



当ブログの内容をまとめた Xamarin逆引きメニュー は以下のURLからご覧になれます。
http://itblogdsi.blog.fc2.com/blog-entry-81.html


関連記事

コメント

コメントの投稿

アルバム

広告

プロフィール

石河 純


著者名 :石河 純
自己紹介:素人上がりのIT技術者。趣味は卓球・車・ボウリング

IT関連の知識はざっくりとこんな感じです。
【OS関連】
WindowsServer: 2012/2008R2/2003/2000/NT4
Windows: 10/8/7/XP/2000/me/NT4/98
Linux: CentOS RedHatLinux9
Mac: macOS Sierra 10.12 / OSX Lion 10.7.5 / OSX Snow Leopard 10.6.8
【言語・データベース】
VB.net ASP.NET C#.net Java VBA
Xamarin.Forms
Oracle10g SQLServer2008R2 SQLAnywhere8/11/16
ActiveReport CrystalReport ReportNet(IBM)
【ネットワーク関連】
CCNP シスコ技術者認定
Cisco Catalyst シリーズ
Yamaha RTXシリーズ
FireWall関連
【WEB関連】
SEO SEM CSS IIS6/7 apache2

休みの日は卓球をやっています。
現在、卓球用品通販ショップは休業中です。