ehealthsolutions/element-x-ios
3
0
Fork 0
mirror of https://github.com/Novaloop-AG/element-x-ios.git synced 2026-11-03 16:10:20 +00:00
Code Issues Packages Projects Releases Wiki Activity

Custom media gallery views for files and voice messages (#3610)

Browse Source 
* Extract the timeline item background from the BubbledStyler.
* Use different views for files and voices messages, reuse the timeline content but only keep the bubble background instead of the whole TimelineStyler.
* Add back max voice message width and add missing accessibility label
This commit is contained in:
Stefan Ceriu
2024-12-12 17:48:41 +02:00
committed by GitHub
parent 88b5426e97
commit 256ae4d2cc
31 changed files with 398 additions and 91 deletions
Download Patch File Download Diff File Expand all files Collapse all files
ElementX/Sources/Screens/Timeline/View/Style/TimelineItemBubbleBackground.swift
+54
View File
@@ -0,0 +1,54 @@
//
// Copyright 2024 New Vector Ltd.
//
// SPDX-License-Identifier: AGPL-3.0-only
// Please see LICENSE in the repository root for full details.
//
import SwiftUI
extension View {
func bubbleBackground(timelineItem: EventBasedTimelineItemProtocol,
insets: EdgeInsets,
color: Color? = nil) -> some View {
modifier(TimelineItemBubbleBackgroundModifier(timelineItem: timelineItem,
insets: insets,
color: color))
}
}
private struct TimelineItemBubbleBackgroundModifier: ViewModifier {
@Environment(\.timelineGroupStyle) private var timelineGroupStyle
let timelineItem: EventBasedTimelineItemProtocol
let insets: EdgeInsets
var color: Color?
func body(content: Content) -> some View {
content
.padding(insets)
.background(color)
.cornerRadius(12, corners: roundedCorners)
}
private var roundedCorners: UIRectCorner {
switch timelineGroupStyle {
case .single:
return .allCorners
case .first:
if timelineItem.isOutgoing {
return [.topLeft, .topRight, .bottomLeft]
} else {
return [.topLeft, .topRight, .bottomRight]
}
case .middle:
return timelineItem.isOutgoing ? [.topLeft, .bottomLeft] : [.topRight, .bottomRight]
case .last:
if timelineItem.isOutgoing {
return [.topLeft, .bottomLeft, .bottomRight]
} else {
return [.topRight, .bottomLeft, .bottomRight]
}
}
}
}
ElementX/Sources/Screens/Timeline/View/Style/TimelineItemBubbledStylerView.swift
+3 -32
View File
@@ -163,9 +163,9 @@ struct TimelineItemBubbledStylerView<Content: View>: View {
var messageBubble: some View {
contentWithReply
.timelineItemSendInfo(timelineItem: timelineItem, adjustedDeliveryStatus: adjustedDeliveryStatus, context: context)
.bubbleStyle(insets: timelineItem.bubbleInsets,
color: timelineItem.bubbleBackgroundColor,
corners: roundedCorners)
.bubbleBackground(timelineItem: timelineItem,
insets: timelineItem.bubbleInsets,
color: timelineItem.bubbleBackgroundColor)
}
@ViewBuilder
@@ -217,40 +217,11 @@ struct TimelineItemBubbledStylerView<Content: View>: View {
timelineItem.isOutgoing ? .trailing : .leading
}
private var roundedCorners: UIRectCorner {
switch timelineGroupStyle {
case .single:
return .allCorners
case .first:
if timelineItem.isOutgoing {
return [.topLeft, .topRight, .bottomLeft]
} else {
return [.topLeft, .topRight, .bottomRight]
}
case .middle:
return timelineItem.isOutgoing ? [.topLeft, .bottomLeft] : [.topRight, .bottomRight]
case .last:
if timelineItem.isOutgoing {
return [.topLeft, .bottomLeft, .bottomRight]
} else {
return [.topRight, .bottomLeft, .bottomRight]
}
}
}
private var shouldShowSenderDetails: Bool {
timelineGroupStyle.shouldShowSenderDetails
}
}
private extension View {
func bubbleStyle(insets: EdgeInsets, color: Color? = nil, cornerRadius: CGFloat = 12, corners: UIRectCorner) -> some View {
padding(insets)
.background(color)
.cornerRadius(cornerRadius, corners: corners)
}
}
private extension EventBasedTimelineItemProtocol {
var bubbleBackgroundColor: Color? {
let defaultColor: Color = isOutgoing ? .compound._bgBubbleOutgoing : .compound._bgBubbleIncoming