diff --git a/ElementX/Resources/Assets.xcassets/Images/timelineComposerSendMessage.imageset/Contents.json b/ElementX/Resources/Assets.xcassets/Images/timelineComposerSendMessage.imageset/Contents.json index 538eaa5da9..a88d70f2b1 100644 --- a/ElementX/Resources/Assets.xcassets/Images/timelineComposerSendMessage.imageset/Contents.json +++ b/ElementX/Resources/Assets.xcassets/Images/timelineComposerSendMessage.imageset/Contents.json @@ -1,7 +1,7 @@ { "images" : [ { - "filename" : "timelineComposerSendMessage.svg", + "filename" : "send.svg", "idiom" : "universal" } ], diff --git a/ElementX/Resources/Assets.xcassets/Images/timelineComposerSendMessage.imageset/send.svg b/ElementX/Resources/Assets.xcassets/Images/timelineComposerSendMessage.imageset/send.svg new file mode 100644 index 0000000000..1cabb86908 --- /dev/null +++ b/ElementX/Resources/Assets.xcassets/Images/timelineComposerSendMessage.imageset/send.svg @@ -0,0 +1,3 @@ + + + diff --git a/ElementX/Resources/Assets.xcassets/Images/timelineComposerSendMessage.imageset/timelineComposerSendMessage.svg b/ElementX/Resources/Assets.xcassets/Images/timelineComposerSendMessage.imageset/timelineComposerSendMessage.svg deleted file mode 100644 index a9d140d062..0000000000 --- a/ElementX/Resources/Assets.xcassets/Images/timelineComposerSendMessage.imageset/timelineComposerSendMessage.svg +++ /dev/null @@ -1,5 +0,0 @@ - - - - - diff --git a/ElementX/Resources/Assets.xcassets/Images/timelineScrollToBottom.imageset/Contents.json b/ElementX/Resources/Assets.xcassets/Images/timelineScrollToBottom.imageset/Contents.json deleted file mode 100644 index a223dee6c5..0000000000 --- a/ElementX/Resources/Assets.xcassets/Images/timelineScrollToBottom.imageset/Contents.json +++ /dev/null @@ -1,23 +0,0 @@ -{ - "images" : [ - { - "filename" : "timelineScrollToBottom.png", - "idiom" : "universal", - "scale" : "1x" - }, - { - "filename" : "timelineScrollToBottom@2x.png", - "idiom" : "universal", - "scale" : "2x" - }, - { - "filename" : "timelineScrollToBottom@3x.png", - "idiom" : "universal", - "scale" : "3x" - } - ], - "info" : { - "author" : "xcode", - "version" : 1 - } -} diff --git a/ElementX/Resources/Assets.xcassets/Images/timelineScrollToBottom.imageset/timelineScrollToBottom.png b/ElementX/Resources/Assets.xcassets/Images/timelineScrollToBottom.imageset/timelineScrollToBottom.png deleted file mode 100644 index 992d1edafc..0000000000 Binary files a/ElementX/Resources/Assets.xcassets/Images/timelineScrollToBottom.imageset/timelineScrollToBottom.png and /dev/null differ diff --git a/ElementX/Resources/Assets.xcassets/Images/timelineScrollToBottom.imageset/timelineScrollToBottom@2x.png b/ElementX/Resources/Assets.xcassets/Images/timelineScrollToBottom.imageset/timelineScrollToBottom@2x.png deleted file mode 100644 index c218462932..0000000000 Binary files a/ElementX/Resources/Assets.xcassets/Images/timelineScrollToBottom.imageset/timelineScrollToBottom@2x.png and /dev/null differ diff --git a/ElementX/Resources/Assets.xcassets/Images/timelineScrollToBottom.imageset/timelineScrollToBottom@3x.png b/ElementX/Resources/Assets.xcassets/Images/timelineScrollToBottom.imageset/timelineScrollToBottom@3x.png deleted file mode 100644 index 936e577073..0000000000 Binary files a/ElementX/Resources/Assets.xcassets/Images/timelineScrollToBottom.imageset/timelineScrollToBottom@3x.png and /dev/null differ diff --git a/ElementX/Sources/Generated/Assets.swift b/ElementX/Sources/Generated/Assets.swift index c45a0f33da..2a47f393b4 100644 --- a/ElementX/Sources/Generated/Assets.swift +++ b/ElementX/Sources/Generated/Assets.swift @@ -36,7 +36,6 @@ internal enum Asset { internal static let appLogo = ImageAsset(name: "Images/app-logo") internal static let closeCircle = ImageAsset(name: "Images/close_circle") internal static let timelineComposerSendMessage = ImageAsset(name: "Images/timelineComposerSendMessage") - internal static let timelineScrollToBottom = ImageAsset(name: "Images/timelineScrollToBottom") } } // swiftlint:enable identifier_name line_length nesting type_body_length type_name diff --git a/ElementX/Sources/Screens/RoomScreen/View/MessageComposer.swift b/ElementX/Sources/Screens/RoomScreen/View/MessageComposer.swift index b30c3b6057..a0d579518a 100644 --- a/ElementX/Sources/Screens/RoomScreen/View/MessageComposer.swift +++ b/ElementX/Sources/Screens/RoomScreen/View/MessageComposer.swift @@ -21,12 +21,14 @@ struct MessageComposer: View { @Binding var focused: Bool let sendingDisabled: Bool let type: RoomScreenComposerMode - @State private var isMultiline = false let sendAction: () -> Void let replyCancellationAction: () -> Void let editCancellationAction: () -> Void + @State private var isMultiline = false + @ScaledMetric private var sendButtonIconSize = 16 + var body: some View { let roundedRectangle = RoundedRectangle(cornerRadius: borderRadius) VStack(alignment: .leading, spacing: -6) { @@ -48,14 +50,13 @@ struct MessageComposer: View { .symbolVariant(.fill) .font(.element.body) .foregroundColor(sendingDisabled ? .element.quaternaryContent : .global.white) - .padding(5) .background { Circle() .foregroundColor(sendingDisabled ? .clear : .element.brand) } } .disabled(sendingDisabled) - .animation(.elementDefault, value: sendingDisabled) + .animation(.linear(duration: 0.1), value: sendingDisabled) .keyboardShortcut(.return, modifiers: [.command]) .padding([.vertical, .trailing], 6) } @@ -70,7 +71,9 @@ struct MessageComposer: View { .opacity(focused ? 1 : 0) } } - .animation(.elementDefault, value: type) + // Explicitly disable all animations to fix weirdness with the header immediately + // appearing whilst the text field and keyboard are still animating up to it. + .animation(.noAnimation, value: type) } @ViewBuilder @@ -93,9 +96,12 @@ struct MessageComposer: View { .fontWeight(.medium) .accessibilityLabel(ElementL10n.actionConfirm) .accessibilityHidden(!type.isEdit) - Image(systemName: "paperplane") - .offset(x: -1, y: 0) + Image(asset: Asset.Images.timelineComposerSendMessage) + .resizable() + .frame(width: sendButtonIconSize, height: sendButtonIconSize) + .padding(EdgeInsets(top: 7, leading: 8, bottom: 7, trailing: 6)) .opacity(type.isEdit ? 0 : 1) + .accessibilityLabel(ElementL10n.actionSend) .accessibilityHidden(type.isEdit) } } diff --git a/ElementX/Sources/Screens/RoomScreen/View/RoomScreen.swift b/ElementX/Sources/Screens/RoomScreen/View/RoomScreen.swift index 85d80a27cf..4094cbf07a 100644 --- a/ElementX/Sources/Screens/RoomScreen/View/RoomScreen.swift +++ b/ElementX/Sources/Screens/RoomScreen/View/RoomScreen.swift @@ -64,8 +64,18 @@ struct RoomScreen: View { var scrollToBottomButton: some View { Button { context.viewState.scrollToBottomPublisher.send(()) } label: { - Image(uiImage: Asset.Images.timelineScrollToBottom.image) - .shadow(radius: 2.0) + Image(systemName: "chevron.down") + .font(.element.body) + .fontWeight(.semibold) + .foregroundColor(.element.secondaryContent) + .padding(13) + .offset(y: 1) + .background { + Circle() + .fill(Color.element.background) + // Intentionally using system primary colour to get white/black. + .shadow(color: .primary.opacity(0.33), radius: 2.0) + } .padding() } .opacity(context.scrollToBottomButtonVisible ? 1.0 : 0.0)