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

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

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

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

Q&A

解決済

1回答

3712閲覧

チャットアプリのレイアウトについて

退会済みユーザー

退会済みユーザー

総合スコア0

Android

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

0グッド

0クリップ

投稿2015/10/31 09:15

編集2015/10/31 09:18

###実現したいこと
現在、WhatAppなどのチャットアプリの作成にチャレンジしています。
今、ユーザーとのチャット部分を作っているのですが、レイアウトで躓いています。
現在のレイアウトが下記の画像です。
問題なのは、メッセージ入力部分とリストビューとかぶってしまっていて見栄えがとても悪い状態です。
色々やってみたのですが、解決できませんでした。
どなたかお力を貸していただけないでしょうか?
イメージ説明
###ソースコード

xml

1<?xml version="1.0" encoding="utf-8"?> 2<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" 3 xmlns:app="http://schemas.android.com/apk/res-auto" 4 xmlns:tools="http://schemas.android.com/tools" 5 android:layout_width="match_parent" 6 android:layout_height="match_parent" 7 android:fitsSystemWindows="true" 8 tools:context=""> 9 10 <android.support.design.widget.AppBarLayout 11 android:layout_width="match_parent" 12 android:layout_height="wrap_content" 13 android:theme="@style/AppTheme.AppBarOverlay"> 14 15 <android.support.v7.widget.Toolbar 16 android:id="@+id/toolbar" 17 android:layout_width="match_parent" 18 android:layout_height="?attr/actionBarSize" 19 android:background="?attr/colorPrimary" 20 app:popupTheme="@style/AppTheme.PopupOverlay" /> 21 22 </android.support.design.widget.AppBarLayout> 23 24 <include layout="@layout/content_chat" /> 25 26 <android.support.design.widget.TextInputLayout 27 android:id="@+id/text_input_layout" 28 android:layout_width="300sp" 29 android:layout_height="wrap_content" 30 android:layout_gravity="bottom|start" 31 android:layout_marginBottom="10sp" 32 android:layout_marginStart="10sp"> 33 34 <EditText 35 android:layout_width="match_parent" 36 android:layout_height="wrap_content" /> 37 38 </android.support.design.widget.TextInputLayout> 39 40 <android.support.design.widget.FloatingActionButton 41 android:id="@+id/fab" 42 android:layout_width="wrap_content" 43 android:layout_height="wrap_content" 44 android:layout_gravity="bottom|end" 45 android:layout_margin="@dimen/fab_margin" 46 android:src="@drawable/ic_send_white_24dp" /> 47 48</android.support.design.widget.CoordinatorLayout> 49

xml

1<?xml version="1.0" encoding="utf-8"?> 2<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 3 xmlns:app="http://schemas.android.com/apk/res-auto" 4 xmlns:tools="http://schemas.android.com/tools" 5 android:layout_width="match_parent" 6 android:layout_height="match_parent" 7 android:paddingBottom="@dimen/activity_vertical_margin" 8 android:paddingLeft="@dimen/activity_horizontal_margin" 9 android:paddingRight="@dimen/activity_horizontal_margin" 10 android:paddingTop="@dimen/activity_vertical_margin" 11 app:layout_behavior="@string/appbar_scrolling_view_behavior" 12 tools:context="si.q2.intrachat.ChatActivity" 13 tools:showIn="@layout/activity_chat"> 14 15 <ListView 16 android:id="@+id/listView" 17 android:layout_width="wrap_content" 18 android:layout_height="wrap_content" /> 19</RelativeLayout> 20

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

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

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

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

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

guest

回答1

0

ベストアンサー

ListViewの下に入力欄を重ならないように置きたいということですね?

CoordinatorLayoutは必須ですか?
LinearLayoutにすると簡単にできそうですが。

投稿2015/10/31 09:43

yona

総合スコア18155

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

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

退会済みユーザー

退会済みユーザー

2015/10/31 09:53

CoordinatorLayoutはAndroid Studioのテンプレートをそのまま使っているだけです。 LinearLayoutを使うとどのようにできるのでしょうか。
退会済みユーザー

退会済みユーザー

2015/10/31 12:19

色々試してみましたが、CoordinatorLayoutから変更してしまうとダメみたいです。 CoordinatorLayoutで入力欄を重ならないように置く方法はありますか?
yona

2015/10/31 13:00

すみません、CoordinatorLayoutをそもそも勘違いしていました。 デザイン方針を踏襲するのであれば被ることを回避するのでは無く、下記のようにするべきかなと思います。 1:メッセージ入力欄を不可視化しておく 2:現在の送信ボタンをメッセージ追加ボタンに変更。 3:1のメッセージ追加ボタンを押すとメッセージ入力欄を可視化する。 4:メッセージが入力されたらメッセージ追加ボタンをメッセージ送信ボタンに変更する。 5:送信ボタンが押されたらメッセージ入力欄を不可視化しておく。
退会済みユーザー

退会済みユーザー

2015/11/01 09:39

ご指導ありがとうございました。
yona

2015/11/01 09:55

うまい回答ができなくてすみません、少し調べてみます。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.39%

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

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

質問する

関連した質問