optimize message input for size+a11y

Signed-off-by: Andy Scherzinger <info@andy-scherzinger.de>
This commit is contained in:
Andy Scherzinger 2021-06-29 23:55:40 +02:00
parent 9a4d7b78a2
commit 60def3cc0c
No known key found for this signature in database
GPG Key ID: 6CADC7E3523C308B
3 changed files with 127 additions and 111 deletions

View File

@ -563,6 +563,8 @@ class ChatController(args: Bundle) :
}
}
binding.messageInputView.setPadding(0, 0, 0, 0)
if (args.containsKey("showToggleChat") && args.getBoolean("showToggleChat")) {
binding.callControlToggleChat.visibility = View.VISIBLE
wasDetached = true

View File

@ -20,125 +20,136 @@
~ along with this program. If not, see <http://www.gnu.org/licenses/>.
-->
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:animateLayoutChanges="true"
android:background="@color/bg_default">
android:background="@color/bg_default"
android:orientation="vertical">
<include
android:id="@+id/lobby"
layout="@layout/lobby_view"
android:visibility="gone"
tools:visibility="visible"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<com.facebook.drawee.view.SimpleDraweeView
android:id="@+id/callControlToggleChat"
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_margin="16dp"
android:layout_alignParentEnd="true"
app:backgroundImage="@color/call_buttons_background"
app:placeholderImage="@drawable/ic_call_black_24dp"
app:roundAsCircle="true"
android:elevation="10dp"
android:visibility="gone"
tools:visibility="visible"
/>
<include
android:id="@+id/lobby"
layout="@layout/lobby_view"
android:visibility="gone"
tools:visibility="visible" />
<com.facebook.drawee.view.SimpleDraweeView
android:id="@+id/callControlToggleChat"
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_alignParentEnd="true"
android:layout_margin="16dp"
android:elevation="10dp"
android:visibility="gone"
app:backgroundImage="@color/call_buttons_background"
app:placeholderImage="@drawable/ic_call_black_24dp"
app:roundAsCircle="true"
tools:visibility="visible" />
<LinearLayout
android:id="@+id/progressBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingTop="@dimen/standard_padding"
android:visibility="gone"
tools:visibility="visible">
<include layout="@layout/item_custom_incoming_text_message_shimmer" />
<include layout="@layout/item_custom_incoming_text_message_shimmer" />
<include layout="@layout/item_custom_incoming_text_message_shimmer" />
</LinearLayout>
<com.stfalcon.chatkit.messages.MessagesList
android:id="@+id/messagesListView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="0dp"
android:visibility="gone"
app:dateHeaderTextSize="13sp"
app:incomingBubblePaddingBottom="@dimen/message_bubble_corners_padding"
app:incomingBubblePaddingLeft="@dimen/message_bubble_corners_padding"
app:incomingBubblePaddingRight="@dimen/message_bubble_corners_padding"
app:incomingBubblePaddingTop="@dimen/message_bubble_corners_padding"
app:incomingDefaultBubbleColor="@color/bg_message_list_incoming_bubble"
app:incomingDefaultBubblePressedColor="@color/bg_message_list_incoming_bubble"
app:incomingDefaultBubbleSelectedColor="@color/transparent"
app:incomingImageTimeTextSize="12sp"
app:incomingTextColor="@color/nc_incoming_text_default"
app:incomingTextLinkColor="@color/nc_incoming_text_default"
app:incomingTextSize="@dimen/chat_text_size"
app:incomingTimeTextSize="12sp"
app:outcomingBubblePaddingBottom="@dimen/message_bubble_corners_padding"
app:outcomingBubblePaddingLeft="@dimen/message_bubble_corners_padding"
app:outcomingBubblePaddingRight="@dimen/message_bubble_corners_padding"
app:outcomingBubblePaddingTop="@dimen/message_bubble_corners_padding"
app:outcomingDefaultBubbleColor="@color/colorPrimary"
app:outcomingDefaultBubblePressedColor="@color/colorPrimary"
app:outcomingDefaultBubbleSelectedColor="@color/transparent"
app:outcomingImageTimeTextSize="12sp"
app:outcomingTextColor="@color/nc_outcoming_text_default"
app:outcomingTextLinkColor="@color/nc_outcoming_text_default"
app:outcomingTextSize="@dimen/chat_text_size"
app:outcomingTimeTextSize="12sp"
app:textAutoLink="all" />
<com.webianks.library.PopupBubble
android:id="@+id/popupBubbleView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_margin="16dp"
android:paddingStart="0dp"
android:paddingEnd="8dp"
app:pb_backgroundColor="@color/colorPrimary"
app:pb_icon="@drawable/ic_baseline_arrow_downward_24px"
app:pb_text="@string/nc_new_messages"
app:pb_textColor="@color/textColorOnPrimaryBackground" />
</RelativeLayout>
<LinearLayout
android:id="@+id/progressBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingTop="@dimen/standard_padding"
android:visibility="gone"
tools:visibility="visible">
android:orientation="vertical">
<include layout="@layout/item_custom_incoming_text_message_shimmer" />
<View
android:id="@+id/separator"
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="@color/controller_chat_separator" />
<include layout="@layout/item_custom_incoming_text_message_shimmer" />
<include layout="@layout/item_custom_incoming_text_message_shimmer" />
<com.stfalcon.chatkit.messages.MessageInput
android:id="@+id/messageInputView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:animateLayoutChanges="true"
android:inputType="textLongMessage|textAutoComplete"
android:maxLength="1000"
app:attachmentButtonBackground="@color/transparent"
app:attachmentButtonHeight="48dp"
app:attachmentButtonIcon="@drawable/ic_baseline_attach_file_24"
app:attachmentButtonMargin="0dp"
app:attachmentButtonWidth="48dp"
app:delayTypingStatus="200"
app:inputButtonDefaultBgColor="@color/transparent"
app:inputButtonDefaultIconColor="@color/colorPrimary"
app:inputButtonHeight="48dp"
app:inputButtonMargin="0dp"
app:inputButtonWidth="48dp"
app:inputHint="@string/nc_hint_enter_a_message"
app:inputTextColor="@color/nc_incoming_text_default"
app:inputTextSize="16sp"
app:showAttachmentButton="true" />
</LinearLayout>
<View
android:id="@+id/separator"
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_above="@+id/messageInputView"
android:background="@color/controller_chat_separator" />
<com.stfalcon.chatkit.messages.MessageInput
android:id="@+id/messageInputView"
android:animateLayoutChanges="true"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:inputType="textLongMessage|textAutoComplete"
android:maxLength="1000"
app:showAttachmentButton="true"
app:attachmentButtonHeight="48dp"
app:attachmentButtonWidth="48dp"
app:attachmentButtonIcon="@drawable/ic_baseline_attach_file_24"
app:attachmentButtonBackground="@color/transparent"
app:inputButtonDefaultBgColor="@color/colorPrimary"
app:inputButtonHeight="48dp"
app:inputButtonMargin="8dp"
app:inputButtonWidth="48dp"
app:inputHint="@string/nc_hint_enter_a_message"
app:inputTextColor="@color/nc_incoming_text_default"
app:inputTextSize="16sp"
app:delayTypingStatus="200"/>
<com.stfalcon.chatkit.messages.MessagesList
android:id="@+id/messagesListView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="@+id/messageInputView"
android:visibility="gone"
app:dateHeaderTextSize="13sp"
android:paddingBottom="4dp"
app:incomingBubblePaddingBottom="@dimen/message_bubble_corners_padding"
app:incomingBubblePaddingLeft="@dimen/message_bubble_corners_padding"
app:incomingBubblePaddingRight="@dimen/message_bubble_corners_padding"
app:incomingBubblePaddingTop="@dimen/message_bubble_corners_padding"
app:incomingDefaultBubbleColor="@color/bg_message_list_incoming_bubble"
app:incomingDefaultBubblePressedColor="@color/bg_message_list_incoming_bubble"
app:incomingDefaultBubbleSelectedColor="@color/transparent"
app:incomingImageTimeTextSize="12sp"
app:incomingTextColor="@color/nc_incoming_text_default"
app:incomingTextLinkColor="@color/nc_incoming_text_default"
app:incomingTextSize="@dimen/chat_text_size"
app:incomingTimeTextSize="12sp"
app:outcomingBubblePaddingBottom="@dimen/message_bubble_corners_padding"
app:outcomingBubblePaddingLeft="@dimen/message_bubble_corners_padding"
app:outcomingBubblePaddingRight="@dimen/message_bubble_corners_padding"
app:outcomingBubblePaddingTop="@dimen/message_bubble_corners_padding"
app:outcomingDefaultBubbleColor="@color/colorPrimary"
app:outcomingDefaultBubblePressedColor="@color/colorPrimary"
app:outcomingDefaultBubbleSelectedColor="@color/transparent"
app:outcomingImageTimeTextSize="12sp"
app:outcomingTextColor="@color/nc_outcoming_text_default"
app:outcomingTextLinkColor="@color/nc_outcoming_text_default"
app:outcomingTextSize="@dimen/chat_text_size"
app:outcomingTimeTextSize="12sp"
app:textAutoLink="all" />
<com.webianks.library.PopupBubble
android:id="@+id/popupBubbleView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="@+id/separator"
android:layout_centerHorizontal="true"
android:layout_margin="16dp"
android:paddingStart="0dp"
android:paddingEnd="8dp"
app:pb_backgroundColor="@color/colorPrimary"
app:pb_icon="@drawable/ic_baseline_arrow_downward_24px"
app:pb_text="@string/nc_new_messages"
app:pb_textColor="@color/textColorOnPrimaryBackground" />
</RelativeLayout>
</LinearLayout>

View File

@ -30,7 +30,8 @@
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
android:layout_height="wrap_content"
android:layout_marginEnd="4dp">
<include layout="@layout/item_message_quote"
android:layout_width="match_parent"
@ -42,9 +43,10 @@
android:id="@id/attachmentButton"
android:layout_width="48dp"
android:layout_height="48dp"
android:padding="10dp"
android:padding="12dp"
android:layout_below="@id/quotedChatMessageView"
android:background="@color/transparent"
android:src="@drawable/ic_baseline_attach_file_24"
app:tint="?attr/colorControlNormal"
android:scaleType="centerCrop"
android:contentDescription="@string/nc_add_attachment" />
@ -53,7 +55,7 @@
android:id="@+id/smileyButton"
android:layout_width="48dp"
android:layout_height="48dp"
android:padding="10dp"
android:padding="12dp"
android:layout_below="@id/quotedChatMessageView"
android:layout_toEndOf="@id/attachmentButton"
android:background="@color/transparent"
@ -140,6 +142,7 @@
android:id="@id/messageSendButton"
android:layout_width="48dp"
android:layout_height="48dp"
android:padding="12dp"
android:layout_below="@id/quotedChatMessageView"
android:layout_alignParentEnd="true"
android:adjustViewBounds="true"