halkyon-days/appflowy-editor
Watch
1
0
Fork
You've already forked appflowy-editor
 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

chore: optimize the upload image widget UI (#267)

Browse source
This commit is contained in:
Lucas.Xu 2023-06-30 16:25:58 +08:00 • committed by GitHub
commit 3ccb2ad698
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 22 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

5
assets/images/upload_image.svg Normal file
View file

@ -0,0 +1,5 @@
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="3" y="6" width="26" height="20" rx="3" stroke="#00BCF0" stroke-width="2"/>
<circle cx="11" cy="13" r="2" stroke="#00BCF0" stroke-width="2"/>
<path d="M10 26L20.2239 16.9121C20.8422 16.3625 21.7349 16.2503 22.4699 16.6296L29 20" stroke="#00BCF0" stroke-width="2"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 376 B

22
lib/src/editor/block_component/image_block_component/image_upload_widget.dart
View file

@ -129,6 +129,13 @@ class _UploadImageMenuState extends State<UploadImageMenu> {
unselectedLabelColor: Colors.grey, unselectedLabelColor: Colors.grey,
indicatorColor: const Color(0xff00BCF0), indicatorColor: const Color(0xff00BCF0),
dividerColor: Colors.transparent, dividerColor: Colors.transparent,
onTap: (value) {
if (value == 1) {
_focusNode.requestFocus();
} else {
_focusNode.unfocus();
}
},
), ),
), ),
), ),
@ -249,7 +256,7 @@ class _UploadImageMenuState extends State<UploadImageMenu> {
child: GestureDetector( child: GestureDetector(
onTap: () async { onTap: () async {
final result = await _filePicker.pickFiles( final result = await _filePicker.pickFiles(
dialogTitle: 'Select an image', dialogTitle: '',
allowMultiple: false, allowMultiple: false,
type: fp.FileType.image, type: fp.FileType.image,
allowedExtensions: allowedExtensions, allowedExtensions: allowedExtensions,
@ -264,7 +271,7 @@ class _UploadImageMenuState extends State<UploadImageMenu> {
height: 80, height: 80,
margin: const EdgeInsets.all(10.0), margin: const EdgeInsets.all(10.0),
decoration: BoxDecoration( decoration: BoxDecoration(
border: Border.all(color: Colors.grey), border: Border.all(color: const Color(0xff00BCF0)),
borderRadius: BorderRadius.circular(12.0), borderRadius: BorderRadius.circular(12.0),
), ),
child: _localImagePath != null child: _localImagePath != null
@ -281,11 +288,16 @@ class _UploadImageMenuState extends State<UploadImageMenu> {
child: Column( child: Column(
mainAxisAlignment: MainAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.center,
children: [ children: [
Icon(Icons.image, size: 48.0, color: Colors.grey), FlowySvg(
name: 'upload_image',
width: 32,
height: 32,
),
SizedBox(height: 8.0), SizedBox(height: 8.0),
Text( Text(
'Pick a file', 'Chose an image',
style: TextStyle(fontSize: 14.0, color: Colors.grey), style:
TextStyle(fontSize: 14.0, color: Color(0xff00BCF0)),
), ),
], ],
), ),