[Rich text editor] Fix design and spacing of rich text editor (#7658)

Improve design and spacing of the rich text editor.

Minor changes to
 - position of input field relative to buttons
 - spacing around attachments button
 - spacing around send button
 - selectable backgrounds
This commit is contained in:
jonnyandrew 2022-11-30 09:00:37 +00:00 committed by GitHub
parent 4b3e36da91
commit 31a1b09e34
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 14 additions and 13 deletions

1
7658.bugfix Normal file
View file

@ -0,0 +1 @@
[Rich text editor] Fix design and spacing of rich text editor

View file

@ -274,8 +274,8 @@ class RichTextComposerLayout @JvmOverloads constructor(
connect(R.id.composerEditTextOuterBorder, ConstraintSet.START, R.id.composerLayoutContent, ConstraintSet.START, dpToPx(12))
connect(R.id.composerEditTextOuterBorder, ConstraintSet.END, R.id.composerLayoutContent, ConstraintSet.END, dpToPx(12))
} else {
connect(R.id.composerEditTextOuterBorder, ConstraintSet.TOP, R.id.composerLayoutContent, ConstraintSet.TOP, dpToPx(10))
connect(R.id.composerEditTextOuterBorder, ConstraintSet.BOTTOM, R.id.composerLayoutContent, ConstraintSet.BOTTOM, dpToPx(10))
connect(R.id.composerEditTextOuterBorder, ConstraintSet.TOP, R.id.composerLayoutContent, ConstraintSet.TOP, dpToPx(8))
connect(R.id.composerEditTextOuterBorder, ConstraintSet.BOTTOM, R.id.composerLayoutContent, ConstraintSet.BOTTOM, dpToPx(8))
connect(R.id.composerEditTextOuterBorder, ConstraintSet.START, R.id.attachmentButton, ConstraintSet.END, 0)
connect(R.id.composerEditTextOuterBorder, ConstraintSet.END, R.id.sendButton, ConstraintSet.START, 0)
}

View file

@ -32,26 +32,26 @@
<ImageButton
android:id="@+id/attachmentButton"
android:layout_width="56dp"
android:layout_height="60dp"
android:layout_margin="@dimen/composer_attachment_margin"
android:background="?android:attr/selectableItemBackground"
android:layout_width="60dp"
android:layout_height="56dp"
android:background="?android:attr/selectableItemBackgroundBorderless"
android:contentDescription="@string/option_send_files"
android:src="@drawable/ic_rich_composer_add"
android:paddingStart="4dp"
app:layout_constraintVertical_bias="1"
app:layout_constraintBottom_toBottomOf="@id/sendButton"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="@id/sendButton"
app:layout_goneMarginBottom="57dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_goneMarginBottom="56dp"
tools:ignore="MissingPrefix,RtlSymmetry" />
<!-- Constraints are updated programmatically -->
<FrameLayout
android:id="@+id/composerEditTextOuterBorder"
android:layout_width="0dp"
android:layout_height="0dp"
android:minHeight="40dp"
android:layout_marginTop="8dp"
android:layout_marginBottom="8dp"
android:layout_marginHorizontal="12dp"
app:layout_constraintVertical_bias="0"
app:layout_constraintTop_toTopOf="parent"
@ -156,19 +156,19 @@
app:layout_constraintBottom_toBottomOf="@id/composerEditTextOuterBorder"
app:layout_constraintVertical_bias="0"
android:src="@drawable/ic_composer_full_screen"
android:background="?android:attr/selectableItemBackground"
android:background="?android:attr/selectableItemBackgroundBorderless"
android:contentDescription="@string/rich_text_editor_full_screen_toggle" />
<ImageButton
android:id="@+id/sendButton"
android:layout_width="56dp"
android:layout_height="60dp"
android:layout_height="56dp"
android:paddingEnd="4dp"
android:contentDescription="@string/action_send"
android:scaleType="center"
android:src="@drawable/ic_rich_composer_send"
android:visibility="invisible"
android:background="?android:selectableItemBackground"
android:background="?android:attr/selectableItemBackgroundBorderless"
app:layout_constraintTop_toBottomOf="@id/composerEditTextOuterBorder"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"