10
6

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

Xamarin.Forms XAML で、Margin の上下左右の順番

Last updated at Posted at 2017-01-05

Xamarin.Forms の XAML で マージン(Margin)やパディング(Padding)を書くとき、上下左右の順番がわからなくなるのでメモ。

XAML に Margin や Padding (いわゆる Thickness)をリテラルで書くときの順番は、 「left, top, right, bottom」 だ。

<?xml version="1.0" encoding="utf-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" 
		xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
		xmlns:local="clr-namespace:MarginTest" 
		x:Class="MarginTest.MarginTestPage" 
		BackgroundColor="Silver">
	
	<BoxView 
		Margin="10, 20, 30, 40"
		BackgroundColor="Red"
		HorizontalOptions="FillAndExpand" 
		VerticalOptions="FillAndExpand" />
	
</ContentPage>

「"左" をスタートに時計まわり」 と覚えておきたい。

Thickness のコンストラクタの引数を見てもよい。

// syntax
public Thickness (Double left, Double top, Double right, Double bottom)

ちなみに css の margin: 10px 20px 30px 40px; は、 ”上” をスタートに時計まわり だ、紛らわしい。

10
6
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
10
6

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?