Voice Recorder iOS 17 style

[terry-brett]

Updating the style for the voice recoder widget for the iOS skin. In iOS 17 there is a new waveform icon that's not avaliable in flutter, so have to add a custom icon here as a font.

This is what it looks like on iOS 17, while voice recorder is recording

light	dark

Updated version on BB app in dark and light themes.

light	dark

Work done:

• Added a new widget VoiceMessageRecorder
• Refactored conversation_text_field with new widget, and using themed colors for the text field when audio is being recorded
• Refactored text_field_suffixto use the new waveform icon and themed colors for iOS variant

Tested on Google Pixel 6 with all 3 skins avaliable in the app

[zlshames]

FYI, we still plan to review this, just haven't had a chance!

[tneotia]

I'm going to make a few changes to the implementation just to cut down on the modifications, but they're hard to describe so once you finish these minor things I'll merge it and update from there. Thanks for the contribution!

[terry-brett]

I'm going to make a few changes to the implementation just to cut down on the modifications, but they're hard to describe so once you finish these minor things I'll merge it and update from there. Thanks for the contribution!

Thanks for the review 😁 I've updated the PR with suggested changes. With custom colours is that something you don't want in general, or could this be behind a flag somewhere in the theme settings for example.

Also for the original waveform colour it's currently set to white, might just be me, but it's hard to see in light mode when recording, maybe that could also be changed in this PR? 🤔

Here's a screenshot of what I mean

[tneotia]

I'll try and get around to reviewing it here soon, but in the meantime:

With custom colours is that something you don't want in general, or could this be behind a flag somewhere in the theme settings for example.

We might expose this via theme settings but for now I think its best that it follows the more global theme settings for best integration with Material You and all that

Also for the original waveform colour it's currently set to white, might just be me, but it's hard to see in light mode when recording, maybe that could also be changed in this PR? 🤔

I agree, I would set this to the background color of the "stop" icon in your image.

[terry-brett]

Sounds goods 😄 I've made all the suggested changes, hope it looks good now!

The suggested colour makes the waveform look much better as well 😊

[tneotia]

@zlshames this would be nice to merge as an iOS UI update

[zlshames]

thank you for the contribution!