Input field

Author: Isaac

submodules/ChatSendMessageActionUI/Sources/SendButton.swift

@@ -28,7 +28,7 @@ final class SendButton: HighlightTrackingButton {
     private let kind: Kind
 
     private let containerView: UIView
-    private let backgroundView: GlassBackgroundView
+    private let backgroundView: UIImageView
     private let iconView: UIImageView
     private var activityIndicator: RadialStatusNode?
 
@@ -41,7 +41,8 @@ final class SendButton: HighlightTrackingButton {
         self.containerView = UIView()
         self.containerView.isUserInteractionEnabled = false
 
-        self.backgroundView = GlassBackgroundView()
+        self.backgroundView = UIImageView()
+        self.backgroundView.image = generateStretchableFilledCircleImage(diameter: 34.0, color: .white)?.withRenderingMode(.alwaysTemplate)
 
         self.iconView = UIImageView()
         self.iconView.isUserInteractionEnabled = false
@@ -69,12 +70,12 @@ final class SendButton: HighlightTrackingButton {
         size: CGSize,
         transition: ComponentTransition
     ) {
-        let innerSize = CGSize(width: size.width, height: size.height)
+        let innerSize = CGSize(width: size.width - 3.0 * 2.0, height: size.height - 3.0 * 2.0)
         let containerFrame = CGRect(origin: CGPoint(x: floorToScreenPixels((size.width - innerSize.width) * 0.5), y: floorToScreenPixels((size.height - innerSize.height) * 0.5)), size: innerSize)
         transition.setFrame(view: self.containerView, frame: containerFrame)
         transition.setCornerRadius(layer: self.containerView.layer, cornerRadius: innerSize.height * 0.5)
 
-        self.backgroundView.update(size: innerSize, cornerRadius: innerSize.height * 0.5, isDark: presentationData.theme.overallDarkAppearance, tintColor: .init(kind: .custom, color: presentationData.theme.chat.inputPanel.actionControlFillColor), transition: .immediate)
+        self.backgroundView.tintColor = presentationData.theme.chat.inputPanel.actionControlFillColor
         transition.setFrame(view: self.backgroundView, frame: CGRect(origin: CGPoint(), size: innerSize))
 
         if self.previousIsAnimatedIn != isAnimatedIn {

submodules/TelegramPresentationData/Sources/Resources/PresentationResourcesChat.swift

@@ -382,21 +382,23 @@ public struct PresentationResourcesChat {
 
     public static func chatInputPanelSendIconImage(_ theme: PresentationTheme) -> UIImage? {
         return theme.image(PresentationResourceKey.chatInputPanelSendIconImage.rawValue, { theme in
-            return generateImage(CGSize(width: 33.0, height: 33.0), rotatedContext: { size, context in
+            return generateImage(CGSize(width: 34.0, height: 34.0), rotatedContext: { size, context in
+                UIGraphicsPushContext(context)
+                defer {
+                    UIGraphicsPopContext()
+                }
+                
                 context.clear(CGRect(origin: CGPoint(), size: size))
                 let color: UIColor
                 if [.day, .night].contains(theme.referenceTheme.baseTheme) && !theme.chat.message.outgoing.bubble.withWallpaper.hasSingleFillColor {
                     color = .white
                 } else {
                     color = theme.chat.inputPanel.actionControlForegroundColor
                 }
-                context.setStrokeColor(color.cgColor)
-                context.setFillColor(color.cgColor)
-                context.setLineWidth(2.0)
-                context.setLineCap(.round)
-                context.setLineJoin(.round)
-                let _ = try? drawSvgPath(context, path: "M11,14.6666667 L16.4310816,9.40016333 L16.4310816,9.40016333 C16.4694824,9.36292619 16.5305176,9.36292619 16.5689184,9.40016333 L22,14.6666667 S ")
-                let _ = try? drawSvgPath(context, path: "M16.5,9.33333333 C17.0522847,9.33333333 17.5,9.78104858 17.5,10.3333333 L17.5,24 C17.5,24.5522847 17.0522847,25 16.5,25 C15.9477153,25 15.5,24.5522847 15.5,24 L15.5,10.3333333 C15.5,9.78104858 15.9477153,9.33333333 16.5,9.33333333 Z ")
+                
+                if let image = generateTintedImage(image: UIImage(bundleImageName: "Chat/Input/Text/SendIcon"), color: color) {
+                    image.draw(in: CGRect(origin: CGPoint(x: floorToScreenPixels((size.width - image.size.width) * 0.5), y: floorToScreenPixels((size.height - image.size.height) * 0.5)), size: image.size))
+                }
             })
         })
     }

submodules/TelegramUI/Components/Chat/ChatRecordingPreviewInputPanelNode/Sources/ChatRecordingPreviewInputPanelNode.swift

@@ -388,7 +388,7 @@ public final class ChatRecordingPreviewInputPanelNodeImpl: ChatInputPanelNode {
     }
 
     override public func updateLayout(width: CGFloat, leftInset: CGFloat, rightInset: CGFloat, bottomInset: CGFloat, additionalSideInsets: UIEdgeInsets, maxHeight: CGFloat, maxOverlayHeight: CGFloat, isSecondary: Bool, transition: ContainedViewLayoutTransition, interfaceState: ChatPresentationInterfaceState, metrics: LayoutMetrics, isMediaInputExpanded: Bool) -> CGFloat {
-        let waveformBackgroundFrame = CGRect(origin: CGPoint(x: 2.0, y: 2.0), size: CGSize(width: width - 2.0 * 2.0, height: 40.0 - 2.0 * 2.0))
+        let waveformBackgroundFrame = CGRect(origin: CGPoint(x: 3.0, y: 3.0), size: CGSize(width: width - 3.0 * 2.0, height: 40.0 - 3.0 * 2.0))
 
         if self.presentationInterfaceState != interfaceState {
             var updateWaveform = false
@@ -479,7 +479,7 @@ public final class ChatRecordingPreviewInputPanelNodeImpl: ChatInputPanelNode {
                         transition: .immediate
                     )
 
-                    let waveformForegroundFrame = CGRect(origin: CGPoint(x: 2.0 + leftHandleFrame.minX, y: 2.0), size: CGSize(width: rightHandleFrame.maxX - leftHandleFrame.minX, height: 40.0 - 2.0 * 2.0))
+                    let waveformForegroundFrame = CGRect(origin: CGPoint(x: 3.0 + leftHandleFrame.minX, y: 3.0), size: CGSize(width: rightHandleFrame.maxX - leftHandleFrame.minX, height: 40.0 - 3.0 * 2.0))
                     transition.updateFrame(node: self.waveformBackgroundNodeImpl, frame: waveformForegroundFrame)
 
                     self.waveformNode.updateClipping(minX: leftHandleFrame.minX - 19.0, maxX: rightHandleFrame.maxX - 19.0, transition: transition)
@@ -563,7 +563,7 @@ public final class ChatRecordingPreviewInputPanelNodeImpl: ChatInputPanelNode {
                         if view.superview == nil {
                             self.view.addSubview(view)
                         }
-                        view.frame = CGRect(origin: CGPoint(x: 2.0, y: 2.0), size: scrubberSize)
+                        view.frame = CGRect(origin: CGPoint(x: 3.0, y: 3.0), size: scrubberSize)
                     }
                 }
             }

submodules/TelegramUI/Components/Chat/ChatRecordingViewOnceButtonNode/Sources/ChatRecordingViewOnceButtonNode.swift

@@ -88,6 +88,8 @@ public final class ChatRecordingViewOnceButtonNode: HighlightTrackingButtonNode
             case .recordMore:
                 self.iconView.image = generateTintedImage(image: UIImage(bundleImageName: "Chat/Input/Text/IconMicrophone"), color: .white)?.withRenderingMode(.alwaysTemplate)
             }
+            
+            self.iconView.tintColor = theme.chat.inputPanel.panelControlColor
         }
 
         let backgroundFrame = CGRect(origin: CGPoint(x: floorToScreenPixels(size.width / 2.0 - innerSize.width / 2.0), y: floorToScreenPixels(size.height / 2.0 - innerSize.height / 2.0)), size: innerSize)

submodules/TelegramUI/Components/Chat/ChatTextInputActionButtonsNode/Sources/ChatTextInputActionButtonsNode.swift

@@ -133,12 +133,11 @@ public final class ChatTextInputActionButtonsNode: ASDisplayNode, ChatSendMessag
     private let presentationContext: ChatPresentationContext?
     private let strings: PresentationStrings
 
-    public let micButtonBackgroundView: GlassBackgroundView
     public let micButtonTintMaskView: UIImageView
     public let micButton: ChatTextInputMediaRecordingButton
 
     public let sendContainerNode: ASDisplayNode
-    public let sendButtonBackgroundView: GlassBackgroundView
+    public let sendButtonBackgroundView: UIImageView
     public let sendButton: HighlightTrackingButtonNode
     public var sendButtonRadialStatusNode: ChatSendButtonRadialStatusNode?
     public var sendButtonHasApplyIcon = false
@@ -147,7 +146,6 @@ public final class ChatTextInputActionButtonsNode: ASDisplayNode, ChatSendMessag
     public let textNode: ImmediateAnimatedCountLabelNode
 
     public let expandMediaInputButton: HighlightTrackingButton
-    private let expandMediaInputButtonBackgroundView: GlassBackgroundView
     private let expandMediaInputButtonIcon: GlassBackgroundView.ContentImageView
 
     private var effectBadgeView: EffectBadgeView?
@@ -164,6 +162,8 @@ public final class ChatTextInputActionButtonsNode: ASDisplayNode, ChatSendMessag
     private var micButtonPointerInteraction: PointerInteraction?
     private var sendButtonPointerInteraction: PointerInteraction?
 
+    let maskContentView: UIView
+    
     private var validLayout: CGSize?
 
     public init(context: AccountContext, presentationInterfaceState: ChatPresentationInterfaceState, presentationContext: ChatPresentationContext?, presentController: @escaping (ViewController) -> Void) {
@@ -173,31 +173,31 @@ public final class ChatTextInputActionButtonsNode: ASDisplayNode, ChatSendMessag
         let strings = presentationInterfaceState.strings
         self.strings = strings
 
-        self.micButtonBackgroundView = GlassBackgroundView()
+        self.maskContentView = UIView()
+        
         self.micButtonTintMaskView = UIImageView()
         self.micButtonTintMaskView.tintColor = .black
         self.micButton = ChatTextInputMediaRecordingButton(context: context, theme: theme, pause: true, strings: strings, presentController: presentController)
         self.micButton.animationOutput = self.micButtonTintMaskView
-        self.micButtonBackgroundView.maskContentView.addSubview(self.micButtonTintMaskView)
+        self.maskContentView.addSubview(self.micButtonTintMaskView)
 
         self.sendContainerNode = ASDisplayNode()
         self.sendContainerNode.layer.allowsGroupOpacity = true
 
-        self.sendButtonBackgroundView = GlassBackgroundView()
+        self.sendButtonBackgroundView = UIImageView()
+        self.sendButtonBackgroundView.image = generateStretchableFilledCircleImage(diameter: 34.0, color: .white)?.withRenderingMode(.alwaysTemplate)
         self.sendButton = HighlightTrackingButtonNode(pointerStyle: nil)
 
         self.textNode = ImmediateAnimatedCountLabelNode()
         self.textNode.isUserInteractionEnabled = false
 
         self.expandMediaInputButton = HighlightTrackingButton()
-        self.expandMediaInputButtonBackgroundView = GlassBackgroundView()
-        self.expandMediaInputButtonBackgroundView.isUserInteractionEnabled = false
-        self.expandMediaInputButton.addSubview(self.expandMediaInputButtonBackgroundView)
         self.expandMediaInputButtonIcon = GlassBackgroundView.ContentImageView()
-        self.expandMediaInputButtonBackgroundView.contentView.addSubview(self.expandMediaInputButtonIcon)
+        self.maskContentView.addSubview(self.expandMediaInputButtonIcon.tintMask)
         self.expandMediaInputButtonIcon.image = PresentationResourcesChat.chatInputPanelExpandButtonImage(presentationInterfaceState.theme)
-        self.expandMediaInputButtonIcon.tintColor = theme.chat.inputPanel.panelControlColor
-        self.expandMediaInputButtonIcon.setMonochromaticEffect(tintColor: theme.chat.inputPanel.panelControlColor)
+        self.expandMediaInputButtonIcon.tintColor = theme.chat.inputPanel.inputControlColor.withAlphaComponent(1.0)
+        self.expandMediaInputButtonIcon.setMonochromaticEffect(tintColor: theme.chat.inputPanel.panelControlColor.withAlphaComponent(1.0))
+        self.expandMediaInputButtonIcon.alpha = theme.chat.inputPanel.panelControlColor.alpha
 
         super.init()
 
@@ -225,14 +225,14 @@ public final class ChatTextInputActionButtonsNode: ASDisplayNode, ChatSendMessag
         }
 
         self.micButton.layer.allowsGroupOpacity = true
-        self.view.addSubview(self.micButtonBackgroundView)
         self.view.addSubview(self.micButton)
 
         self.addSubnode(self.sendContainerNode)
         self.sendContainerNode.view.addSubview(self.sendButtonBackgroundView)
         self.sendContainerNode.addSubnode(self.sendButton)
         self.sendContainerNode.addSubnode(self.textNode)
         self.view.addSubview(self.expandMediaInputButton)
+        self.expandMediaInputButton.addSubview(self.expandMediaInputButtonIcon)
 
         self.expandMediaInputButton.highligthedChanged = { [weak self] highlighted in
             guard let self else {
@@ -265,8 +265,9 @@ public final class ChatTextInputActionButtonsNode: ASDisplayNode, ChatSendMessag
 
     public func updateTheme(theme: PresentationTheme, wallpaper: TelegramWallpaper) {
         self.micButton.updateTheme(theme: theme)
-        self.expandMediaInputButtonIcon.tintColor = theme.chat.inputPanel.panelControlColor
-        self.expandMediaInputButtonIcon.setMonochromaticEffect(tintColor: theme.chat.inputPanel.panelControlColor)
+        self.expandMediaInputButtonIcon.tintColor = theme.chat.inputPanel.panelControlColor.withAlphaComponent(1.0)
+        self.expandMediaInputButtonIcon.setMonochromaticEffect(tintColor: theme.chat.inputPanel.panelControlColor.withAlphaComponent(1.0))
+        self.expandMediaInputButtonIcon.alpha = theme.chat.inputPanel.panelControlColor.alpha
     }
 
     private var absoluteRect: (CGRect, CGSize)?
@@ -285,6 +286,7 @@ public final class ChatTextInputActionButtonsNode: ASDisplayNode, ChatSendMessag
         self.validLayout = size
 
         var innerSize = size
+        innerSize.width = 38.0 + 3.0 * 2.0
 
         var starsAmount: Int64?
         if let sendPaidMessageStars = interfaceState.sendPaidMessageStars, interfaceState.interfaceState.editMessage == nil {
@@ -334,24 +336,19 @@ public final class ChatTextInputActionButtonsNode: ASDisplayNode, ChatSendMessag
             self.sendButton.imageNode.alpha = 1.0
             self.textNode.isHidden = true
         }
-    
-        transition.updateFrame(view: self.micButtonBackgroundView, frame: CGRect(origin: CGPoint(), size: size))
-        self.micButtonBackgroundView.update(size: size, cornerRadius: size.height * 0.5, isDark:  interfaceState.theme.overallDarkAppearance, tintColor: .init(kind: .panel, color: interfaceState.theme.chat.inputPanel.inputBackgroundColor.withMultipliedAlpha(0.7)), transition: ComponentTransition(transition))
 
-        transition.updateFrame(layer: self.micButton.layer, frame: CGRect(origin: CGPoint(), size: size))
+        transition.updateFrame(layer: self.micButton.layer, frame: CGRect(origin: CGPoint(x: 7.0, y: 0.0), size: CGSize(width: size.width - 7.0, height: size.height)))
         self.micButton.layoutItems()
 
-        transition.updateFrame(view: self.sendButtonBackgroundView, frame: CGRect(origin: CGPoint(), size: innerSize))
-        self.sendButtonBackgroundView.update(size: innerSize, cornerRadius: innerSize.height * 0.5, isDark: interfaceState.theme.overallDarkAppearance, tintColor: .init(kind: .custom, color: interfaceState.theme.chat.inputPanel.actionControlFillColor), transition: ComponentTransition(transition))
+        transition.updateFrame(view: self.sendButtonBackgroundView, frame: CGRect(origin: CGPoint(), size: innerSize).insetBy(dx: 3.0, dy: 3.0))
+        self.sendButtonBackgroundView.tintColor = interfaceState.theme.chat.inputPanel.panelControlAccentColor
         transition.updateFrame(layer: self.sendButton.layer, frame: CGRect(origin: CGPoint(), size: innerSize))
         transition.updateFrame(node: self.sendContainerNode, frame: CGRect(origin: CGPoint(), size: innerSize))
 
         let backgroundSize = CGSize(width: innerSize.width, height: 40.0)
         let backgroundFrame = CGRect(origin: CGPoint(x: showTitle ? 5.0 + UIScreenPixel : floorToScreenPixels((size.width - backgroundSize.width) / 2.0), y: floorToScreenPixels((size.height - backgroundSize.height) / 2.0)), size: backgroundSize)
 
         transition.updateFrame(view: self.expandMediaInputButton, frame: CGRect(origin: CGPoint(), size: size))
-        transition.updateFrame(view: self.expandMediaInputButtonBackgroundView, frame: CGRect(origin: CGPoint(), size: size))
-        self.expandMediaInputButtonBackgroundView.update(size: size, cornerRadius: size.height * 0.5, isDark: interfaceState.theme.overallDarkAppearance, tintColor: .init(kind: .panel, color: interfaceState.theme.chat.inputPanel.inputBackgroundColor.withMultipliedAlpha(0.7)), transition: ComponentTransition(transition))
         if let image = self.expandMediaInputButtonIcon.image {
             let expandIconFrame = CGRect(origin: CGPoint(x: floor((size.width - image.size.width) * 0.5), y: floor((size.height - image.size.height) * 0.5)), size: image.size)
             self.expandMediaInputButtonIcon.center = expandIconFrame.center