improve voice message UI

Signed-off-by: Andy Scherzinger <info@andy-scherzinger.de>
This commit is contained in:
Andy Scherzinger 2021-06-21 21:56:20 +02:00
parent edc4f65780
commit db68b4e93d
No known key found for this signature in database
GPG Key ID: 6CADC7E3523C308B
7 changed files with 82 additions and 42 deletions

View File

@ -89,7 +89,7 @@ class OutcomingVoiceMessageViewHolder(incomingView: View) : MessageHolders
colorizeMessageBubble(message) colorizeMessageBubble(message)
itemView.isSelected = false itemView.isSelected = false
binding.messageTime.setTextColor(context?.resources!!.getColor(R.color.warm_grey_four)) binding.messageTime.setTextColor(context!!.resources.getColor(R.color.white60))
// parent message handling // parent message handling
setParentMessageDataOnMessageItem(message) setParentMessageDataOnMessageItem(message)

View File

@ -1,9 +0,0 @@
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="line">
<stroke android:width="2dp" android:color="@color/nc_voice_message_outgoing_controls"/>
<corners android:radius="1dp" />
</shape>

View File

@ -1,9 +1,29 @@
<?xml version="1.0" encoding="utf-8"?> <?xml version="1.0" encoding="utf-8"?>
<!--
~ Nextcloud Talk application
~
~ @author Marcel Hibbe
~ Copyright (C) 2021 Marcel Hibbe <dev@mhibbe.de>
~
~ This program is free software: you can redistribute it and/or modify
~ it under the terms of the GNU General Public License as published by
~ the Free Software Foundation, either version 3 of the License, or
~ at your option) any later version.
~
~ This program is distributed in the hope that it will be useful,
~ but WITHOUT ANY WARRANTY; without even the implied warranty of
~ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
~ GNU General Public License for more details.
~
~ You should have received a copy of the GNU General Public License
~ along with this program. If not, see <http://www.gnu.org/licenses/>.
-->
<shape xmlns:android="http://schemas.android.com/apk/res/android" <shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval"> android:shape="oval">
<size android:height="12dp" android:width="12dp"/> <size android:height="12dp" android:width="12dp"/>
<solid android:color="@color/nc_voice_message_outgoing_controls" /> <solid android:color="#ffffff" />
<corners android:radius="1dp" /> <corners android:radius="1dp" />
</shape> </shape>

View File

@ -24,6 +24,7 @@
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent" android:layout_width="match_parent"
android:layout_height="wrap_content" android:layout_height="wrap_content"
android:layout_marginLeft="16dp" android:layout_marginLeft="16dp"
@ -77,29 +78,35 @@
android:layout_gravity="center" android:layout_gravity="center"
android:visibility="gone"/> android:visibility="gone"/>
<ImageButton <com.google.android.material.button.MaterialButton
android:id="@+id/playBtn" android:id="@+id/playBtn"
android:layout_width="44dp" style="@style/Widget.AppTheme.Button.IconButton"
android:layout_height="44dp" android:layout_width="48dp"
android:background="@drawable/ic_baseline_play_arrow_voice_message_24" android:layout_height="48dp"
android:contentDescription="@string/play_voice_message"
android:visibility="visible" android:visibility="visible"
android:contentDescription="@string/play_voice_message"> app:cornerRadius="@dimen/button_corner_radius"
</ImageButton> app:icon="@drawable/ic_baseline_play_arrow_voice_message_24"
app:iconSize="40dp"
app:iconTint="@color/nc_incoming_text_default" />
<ImageButton <com.google.android.material.button.MaterialButton
android:id="@+id/pauseBtn" android:id="@+id/pauseBtn"
android:layout_width="44dp" style="@style/Widget.AppTheme.Button.IconButton"
android:layout_height="44dp" android:layout_width="48dp"
android:background="@drawable/ic_baseline_pause_voice_message_24" android:layout_height="48dp"
android:contentDescription="@string/pause_voice_message"
android:visibility="gone" android:visibility="gone"
android:contentDescription="@string/pause_voice_message"> app:cornerRadius="@dimen/button_corner_radius"
</ImageButton> app:icon="@drawable/ic_baseline_pause_voice_message_24"
app:iconSize="40dp"
app:iconTint="@color/nc_incoming_text_default" />
<SeekBar <SeekBar
android:id="@+id/seekbar" android:id="@+id/seekbar"
style="@style/Nextcloud.Material.Incoming.SeekBar"
android:layout_width="200dp" android:layout_width="200dp"
android:layout_height="wrap_content"> android:layout_height="wrap_content" />
</SeekBar>
</LinearLayout> </LinearLayout>
@ -109,7 +116,8 @@
android:layout_height="wrap_content" android:layout_height="wrap_content"
android:layout_below="@id/messageText" android:layout_below="@id/messageText"
android:layout_marginStart="8dp" android:layout_marginStart="8dp"
app:layout_alignSelf="center" /> app:layout_alignSelf="center"
tools:text="12:38"/>
</com.google.android.flexbox.FlexboxLayout> </com.google.android.flexbox.FlexboxLayout>
</RelativeLayout> </RelativeLayout>

View File

@ -59,7 +59,7 @@
android:lineSpacingMultiplier="1.2" android:lineSpacingMultiplier="1.2"
android:textColorHighlight="@color/nc_grey" android:textColorHighlight="@color/nc_grey"
android:textIsSelectable="true" android:textIsSelectable="true"
tools:text="Talk to ayou later!" /> tools:text="Talk to you later!" />
<TextView <TextView
android:id="@id/messageTime" android:id="@id/messageTime"

View File

@ -2,8 +2,10 @@
~ Nextcloud Talk application ~ Nextcloud Talk application
~ ~
~ @author Mario Danic ~ @author Mario Danic
~ @author Marcel Hibbe
~ @author Andy Scherzinger ~ @author Andy Scherzinger
~ Copyright (C) 2021 Andy Scherzinger <info@andy-scherzinger.de> ~ Copyright (C) 2021 Andy Scherzinger <info@andy-scherzinger.de>
~ Copyright (C) 2021 Marcel Hibbe <dev@mhibbe.de>
~ Copyright (C) 2017-2018 Mario Danic <mario@lovelyhq.com> ~ Copyright (C) 2017-2018 Mario Danic <mario@lovelyhq.com>
~ ~
~ This program is free software: you can redistribute it and/or modify ~ This program is free software: you can redistribute it and/or modify
@ -60,32 +62,37 @@
android:progressTint="@color/fontAppbar" android:progressTint="@color/fontAppbar"
android:visibility="gone"/> android:visibility="gone"/>
<ImageButton <com.google.android.material.button.MaterialButton
android:id="@+id/playBtn" android:id="@+id/playBtn"
android:layout_width="44dp" style="@style/Widget.AppTheme.Button.IconButton"
android:layout_height="44dp" android:layout_width="48dp"
android:background="@drawable/ic_baseline_play_arrow_voice_message_24" android:layout_height="48dp"
android:contentDescription="@string/play_voice_message"
android:visibility="visible" android:visibility="visible"
android:contentDescription="@string/play_voice_message"> app:cornerRadius="@dimen/button_corner_radius"
</ImageButton> app:icon="@drawable/ic_baseline_play_arrow_voice_message_24"
app:iconSize="40dp"
app:iconTint="@color/nc_outcoming_text_default" />
<ImageButton <com.google.android.material.button.MaterialButton
android:id="@+id/pauseBtn" android:id="@+id/pauseBtn"
android:layout_width="44dp" style="@style/Widget.AppTheme.Button.IconButton"
android:layout_height="44dp" android:layout_width="48dp"
android:background="@drawable/ic_baseline_pause_voice_message_24" android:layout_height="48dp"
android:contentDescription="@string/pause_voice_message"
android:visibility="gone" android:visibility="gone"
android:contentDescription="@string/pause_voice_message"> app:cornerRadius="@dimen/button_corner_radius"
</ImageButton> app:icon="@drawable/ic_baseline_pause_voice_message_24"
app:iconSize="40dp"
app:iconTint="@color/nc_outcoming_text_default" />
<SeekBar <SeekBar
android:id="@+id/seekbar" android:id="@+id/seekbar"
style="@style/Nextcloud.Material.Outgoing.SeekBar"
android:layout_width="200dp" android:layout_width="200dp"
android:layout_height="40dp" android:layout_height="40dp"
android:progressDrawable="@drawable/voice_message_outgoing_seek_bar_ruler"
android:thumb="@drawable/voice_message_outgoing_seek_bar_slider" android:thumb="@drawable/voice_message_outgoing_seek_bar_slider"
tools:progress="50"> tools:progress="50" />
</SeekBar>
</LinearLayout> </LinearLayout>

View File

@ -177,4 +177,18 @@
<item name="android:typeface">sans</item> <item name="android:typeface">sans</item>
<item name="android:textStyle">bold</item> <item name="android:textStyle">bold</item>
</style> </style>
<style name="Nextcloud.Material.Incoming.SeekBar" parent="Widget.AppCompat.SeekBar">
<item name="android:progressBackgroundTint">@color/medium_emphasis_text</item>
<item name="android:progressTint">@color/colorPrimary</item>
<item name="android:colorControlActivated">@color/colorPrimary</item>
</style>
<style name="Nextcloud.Material.Outgoing.SeekBar" parent="Widget.AppCompat.SeekBar">
<item name="android:progressBackgroundTint">#deffffff</item>
<item name="android:progressTint">#ffffff</item>
<item name="android:colorControlActivated">#ffffff</item>
<item name="android:colorControlNormal">#ffffff</item>
</style>
</resources> </resources>