レイアウトが崩れてしまう

###前提・実現したいこと
PercentRelativelayoutを使用し、レイアウトを思い通りにしたい。

###発生している問題・エラーメッセージ
以下の画像のようになるようにしたのですが

実機でひらくと以下の画像のように崩れてしまいます。

###該当のソースコード

XML
1<?xml version="1.0" encoding="utf-8"?>
2<android.support.percent.PercentRelativeLayout
3    xmlns:android="http://schemas.android.com/apk/res/android"
4    xmlns:app="http://schemas.android.com/apk/res-auto"
5    android:id="@+id/text"
6    android:layout_width="match_parent"
7    android:layout_height="match_parent">
8
9    <TextView
10        android:id="@+id/textView1"
11        app:layout_widthPercent="100%"
12        app:layout_heightPercent="10%"
13        android:gravity="center_horizontal"
14        app:layout_marginTopPercent="50%"
15        app:layout_marginBottomPercent="40%"
16        android:text="TextView"
17        android:textColor="#000000"
18        android:textSize="40sp"
19        android:textStyle="bold"
20        android:layout_alignParentTop="true"
21        android:layout_alignParentStart="true"/>
22
23    <TextView
24        android:layout_alignParentTop="true"
25        android:layout_alignParentStart="true"
26        android:id="@+id/textView3"
27        app:layout_widthPercent="40%"
28        app:layout_heightPercent="10%"
29        android:gravity="center_horizontal"
30        app:layout_marginTopPercent="35%"
31        app:layout_marginStartPercent="5%"
32        android:text="TextView"
33        android:textColor="#000000"
34        android:textSize="30sp" />
35
36    <TextView
37        android:layout_alignParentTop="true"
38        android:layout_alignParentStart="true"
39        android:id="@+id/textView2"
40        android:gravity="center_horizontal"
41        app:layout_widthPercent="40%"
42        app:layout_heightPercent="10%"
43        app:layout_marginTopPercent="35%"
44        app:layout_marginStartPercent="55%"
45        android:text="TextView"
46        android:textColor="#000000"
47        android:textSize="30sp" />
48
49    <ImageView
50        android:id="@+id/imageView"
51        app:layout_widthPercent="40%"
52        app:layout_heightPercent="25%"
53        android:scaleType="fitCenter"
54        android:src="@mipmap/ic_launcher"
55        android:background="@color/white"
56        app:layout_marginStartPercent="55%"
57        app:layout_marginTopPercent="8%"
58        android:layout_alignParentTop="true"
59        android:layout_alignParentStart="true"
60        />
61
62    <TextView
63        android:gravity="center_horizontal"
64        android:id="@+id/textView"
65        app:layout_widthPercent="20%"
66        app:layout_heightPercent="5%"
67        app:layout_marginStartPercent="65%"
68        app:layout_marginEndPercent="10%"
69        app:layout_marginTopPercent="2%"
70        android:text="あなた"
71        android:textColor="#000000"
72        android:textSize="20sp"
73        android:layout_alignParentTop="true"
74        android:layout_alignParentStart="true"/>
75
76    <ImageView
77        android:id="@+id/imageView2"
78        app:layout_widthPercent="40%"
79        app:layout_heightPercent="25%"
80        app:layout_marginTopPercent="8%"
81        app:layout_marginStartPercent="5%"
82        android:scaleType="fitCenter"
83        android:src="@mipmap/ic_launcher"
84        android:background="@color/white"
85        android:layout_marginStart="8dp"
86        android:layout_alignParentTop="true"
87        android:layout_alignParentStart="true" />
88
89    <TextView
90        android:id="@+id/textView4"
91        android:gravity="center_horizontal"
92        app:layout_widthPercent="15%"
93        app:layout_heightPercent="5%"
94        app:layout_marginTopPercent="2%"
95        app:layout_marginStartPercent="18%"
96        android:text="相手"
97        android:textColor="#000000"
98        android:textSize="20sp"
99        android:layout_alignParentTop="true"
100        android:layout_alignParentStart="true"/>
101
102    <Button
103        android:id="@+id/button"
104        app:layout_widthPercent="50%"
105        app:layout_heightPercent="10%"
106        android:layout_alignParentBottom="true"
107        android:layout_centerHorizontal="true"
108        app:layout_marginBottomPercent="10%"
109        android:text="もう一度" />
110
111</android.support.percent.PercentRelativeLayout>

いろいろいじくってしまったのが悪いのですが、どのようにすればよいのか教えてください。
お願い致します。

###補足情報(言語/FW/ツール等のバージョンなど)
AndroidStudio2.3

行動規範の内容に同意します

回答1件

ベストアンサー

下記の２つの属性が怪しいですね。

xml
1android:layout_alignParentTop="true"
2android:layout_alignParentStart="true"

投稿2017/05/17 16:56

編集2017/05/17 16:56

yona

総合スコア18155

あなたの回答

tips

プレビュー

行動規範の内容に同意します

質問の解決につながる回答をしましょう。サンプルコードなど、より具体的な説明があると質問者の理解の助けになります。また、読む側のことを考えた、分かりやすい文章を心がけましょう。

15分調べてもわからないことは
teratailで質問しよう！

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう！

レイアウトが崩れてしまう

関連した質問