Xamarin.Froms  RelativeLayout レイアウト

リラティブレイアウトは、子要素を相対的に配置するレイアウトです。 

X座標を指定した例
Constraint.Constant(120),

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

using Xamarin.Forms;

namespace RelativeLayout01
{
    public partial class Page1 : ContentPage
    {

        public Page1()
        {
            //リラティブレイアウトの生成
            var relativeLayout = new RelativeLayout();
            //ラベルの追加
            var label1 = new Label
            {
                Text = "label1",
                BackgroundColor = Color.Blue,
                FontSize = 58,
                XAlign = TextAlignment.Center,
                WidthRequest = 160
            };

            relativeLayout.Children.Add(label1,
                //X座標は、120
                Constraint.Constant(120),
                // Y座標は中央 (親要素との相対位置で配置)                         
                Constraint.RelativeToParent(parent => parent.Height / 2 - 60)
            );

            Content = relativeLayout;
        }
    }
}

label2 他の要素との相対位置で配置

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

using Xamarin.Forms;

namespace RelativeLayout01
{
    public partial class HomePage : ContentPage
    {
        public HomePage()
        {
            BackgroundColor = Color.White;

            //リラティブレイアウトの生成
            var relativeLayout = new RelativeLayout();
            //ラベルの追加
            var label1 = new Label
            {
                Text = "label1",
                BackgroundColor = Color.Blue,
                FontSize = 60 };

            relativeLayout.Children.Add(label1,
                //X座標は、30
                //Constraint.Constant(30),
                // X座標は中央 (親要素との相対位置で配置)
                Constraint.RelativeToParent(parent => parent.Width * .5 - 80),
                // Y座標は中央 (親要素との相対位置で配置)                         
                Constraint.RelativeToParent(parent => parent.Height / 2 - 80)
            );

            //ラベルの追加
            var label2 = new Label
            {
                Text = "label2",
                BackgroundColor = Color.Green,
                FontSize = 40
            };

            relativeLayout.Children.Add(label2,
                //X座標は、120
                Constraint.Constant(120),
                // Y座標は、label1の20下(他の要素との相対位置で配置)
                Constraint.RelativeToView(label1, (parent, sibling) => sibling.Y + sibling.Height + 20)
             );
           
            // relativeLayoutの配置
            Content = relativeLayout;
        }
    }
}

 

目 次

 

コメントをお書きください

コメント: 2
  • #1

    Sophie Mccleskey (火曜日, 24 1月 2017 16:46)


    You actually make it seem really easy together with your presentation however I to find this matter to be really one thing which I think I'd by no means understand. It kind of feels too complicated and extremely vast for me. I am taking a look ahead for your subsequent post, I'll attempt to get the hang of it!

  • #2

    Fae Gillie (水曜日, 01 2月 2017 00:59)


    Heya i'm for the primary time here. I came across this board and I in finding It really useful & it helped me out a lot. I hope to present one thing back and aid others like you aided me.