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

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

新規登録して質問してみよう
ただいま回答率
85.51%
XML

XMLは仕様の1つで、マークアップ言語群を構築するために使われています。

Android

Androidは、Google社が開発したスマートフォンやタブレットなど携帯端末向けのプラットフォームです。 カーネル・ミドルウェア・ユーザーインターフェイス・ウェブブラウザ・電話帳などのアプリケーションやソフトウェアをひとつにまとめて構成。 カーネル・ライブラリ・ランタイムはほとんどがC言語/C++、アプリケーションなどはJavaSEのサブセットとAndroid環境で書かれています。

Q&A

解決済

3回答

4728閲覧

画像と文字列を縦に並べる配置の方法に関して

murapon

総合スコア22

XML

XMLは仕様の1つで、マークアップ言語群を構築するために使われています。

Android

Androidは、Google社が開発したスマートフォンやタブレットなど携帯端末向けのプラットフォームです。 カーネル・ミドルウェア・ユーザーインターフェイス・ウェブブラウザ・電話帳などのアプリケーションやソフトウェアをひとつにまとめて構成。 カーネル・ライブラリ・ランタイムはほとんどがC言語/C++、アプリケーションなどはJavaSEのサブセットとAndroid環境で書かれています。

0グッド

0クリップ

投稿2015/12/07 12:58

androidアプリ開発でxmlファイルを使いレイアウトを定義しているのですが、画像とテキスト・ボタンを縦に並べる方法がわからないので教えてください。
実現したい内容は以下です。
・画面上部に画像を表示し、その下にボタンを横一列で表示する。

以下のようなXMLを書くと、画面上部で画像とボタンが重なって表示されます。

xml

1<RelativeLayout 2 android:layout_width="fill_parent" 3 android:layout_height="fill_parent" 4 xmlns:android="http://schemas.android.com/apk/res/android" 5 android:orientation="vertical"> 6 7 <ImageView 8 android:id="@+id/imageview" 9 android:layout_width="match_parent" 10 android:layout_height="match_parent" 11 android:src="@drawable/logo" 12 android:scaleType="fitStart" 13 android:contentDescription="ロゴ画像" 14 /> 15 16 <LinearLayout 17 android:id="@+id/layout_root" 18 android:layout_width="fill_parent" 19 android:layout_height="fill_parent" 20 xmlns:android="http://schemas.android.com/apk/res/android" 21 android:orientation="vertical" 22 android:layout_alignParentBottom="true"> 23 <Button 24 android:id="@+id/to_login_button" 25 android:layout_width="wrap_content" 26 android:layout_height="wrap_content" 27 android:layout_gravity="bottom" 28 android:text="ログイン" 29 android:textColor="#ffffff" 30 android:layout_centerVertical="true" 31 android:layout_alignParentLeft="true" 32 android:layout_alignParentStart="true"/> 33 34 <Button 35 android:id="@+id/to_register_button" 36 android:layout_width="wrap_content" 37 android:layout_height="wrap_content" 38 android:layout_gravity="bottom" 39 android:text="新規登録" 40 android:textColor="#ffffff" 41 android:layout_alignTop="@+id/to_login_button" 42 android:layout_alignParentRight="true" 43 android:layout_alignParentEnd="true"/> 44 45 </LinearLayout> 46</RelativeLayout>

また、「ボタン」、「テキスト」のみだとLinearLayoutを使えば並べて表示できるのですが、
同じやり方で「画像」を表示しようとすると画像がだけ前面に表示されてしまいます。

画像とボタン、テキストを組み合わせて画面に表示したい場合、
どのようなレイアウトの仕方があるのでしょうか?

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答3

0

自己解決

以下のようにandroid:layout_heightにサイズをdp指定することで解決しました。
なぜかwrap_contentだと画面いっぱいに画像が表示されました。

xml

1<LinearLayout 2 android:layout_width="fill_parent" 3 android:layout_height="fill_parent" 4 xmlns:android="http://schemas.android.com/apk/res/android" 5 android:orientation="vertical"> 6 7 <ImageView 8 android:id="@+id/imageview" 9 android:layout_width="fill_parent" 10 android:layout_height="205dp" 11 android:src="@drawable/logo" 12 android:scaleType="fitStart" 13 android:contentDescription="画像の説明" 14 /> 15 16 <LinearLayout 17 android:id="@+id/layout_root" 18 android:layout_width="wrap_content" 19 android:layout_height="wrap_content" 20 xmlns:android="http://schemas.android.com/apk/res/android" 21 android:orientation="horizontal"> 22 <Button 23 android:id="@+id/to_login_button" 24 android:layout_width="wrap_content" 25 android:layout_height="wrap_content" 26 android:layout_gravity="bottom" 27 android:text="ログイン" 28 android:textColor="#ffffff"/> 29 30 <Button 31 android:id="@+id/to_register_button" 32 android:layout_width="wrap_content" 33 android:layout_height="wrap_content" 34 android:layout_gravity="bottom" 35 android:text="新規登録" 36 android:textColor="#ffffff"/> 37 38 </LinearLayout> 39 40</LinearLayout>

投稿2015/12/08 10:13

murapon

総合スコア22

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

ImageViewlayout_heightにmatch_parentを指定しているので、ボタンやテキストを画面外へ押し出されているのでしょう。
対処方は2つあります。
・match_parentではなくwrap_contentにする。
・ボタンやテキストを含むLinearLayoutを先に記述し、ImageViewの下端をLinearLayoutの上端に合わせる。

投稿2015/12/08 04:09

yona

総合スコア18155

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

murapon

2015/12/08 10:14

ありがとうございました。 wrap_contentにしても画像が画面いっぱいに表示され、ImageViewの位置を変えても解決できませんでした。最終的に android:layout_height="205dp" を固定値でサイズを指定することで解決しました。
yona

2015/12/08 10:57

単純にImageViewにセットしている画像の高さが大きいからでしょう
murapon

2015/12/17 01:18

まさにそれでした・・。 横幅が画面の大きさに合わせて表示されるので縦の長さもそれに合わせて整形されるものと思っていました。 ありがとうございました。
guest

0

RelativeLayoutにorientationの属性は存在しないのですが…
親のレイアウトがRelativeなのに子のビューの相対位置を指定していないためのレイアウト崩れではないでしょうか?
親のレイアウトをLinearLayoutにして、子に入ってるLinearLayoutのorientationをhorizontalにすれば良いのではないでしょうか。

投稿2015/12/07 23:56

swordone

総合スコア20649

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

murapon

2015/12/08 01:14

LinearLayoutにしても変わりませんでした。画像が全面に表示され、ボタンが表示されず・・。 画像自体は横長で横いっぱいに表示しても画面の下半分は空白になるので、その部分にボタンを表示したいのですが・・。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.51%

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

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

質問する

関連した質問