Sade
Sade

Reputation: 1

Flutter: ImagePicker from gallery won't pop up on web in iOS

I'm using the package image_picker on a flutter app to load a picture, and it works fine in the web when accessed by an Windows, MacOs, Android, but in the iOS (16.3) the pop up to choose the image won't show up.

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:image_picker/image_picker.dart';
import "package:image/image.dart" as img;

class ProgramScreen extends StatefulWidget {
  @override
  _ProgramScreenState createState() => _ProgramScreenState();
}

class _ProgramScreenState extends State<ProgramScreen> {
  TextEditingController _destinationController = TextEditingController();
  TextEditingController _subjectController = TextEditingController();

  late Uint8List _clipboardImage;
  bool hasImage = false;
  bool hasText = false;
  double heightImg = 1;
  double widthImg = 1;

  Future _getImageFromPicker() async {
    final ImagePicker _picker = ImagePicker();
    final XFile? image = await _picker.pickImage(
        source: ImageSource.gallery, requestFullMetadata: false);
    var bytes = await image!.readAsBytes();
    var photoData = img.decodeImage(bytes);
    heightImg = photoData!.height * 0.5;
    widthImg = photoData.width * 0.5;
    setState(() {
      hasImage = true;
      hasText = false;
      _clipboardImage = bytes;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      color: Theme.of(context).colorScheme.primaryContainer,
      padding: EdgeInsets.all(16),
      child: SingleChildScrollView(
        child: Column(
          children: <Widget>[
            Container(
              decoration: BoxDecoration(
                borderRadius: BorderRadius.all(Radius.circular(10)),
                color: Colors.white,
              ),
              padding: EdgeInsets.all(16),
              child: Column(
                children: <Widget>[
                  TextField(
                    decoration: InputDecoration(hintText: 'Destinatáio'),
                    controller: _destinationController,
                  ),
                  TextField(
                    decoration: InputDecoration(hintText: 'Assunto'),
                    controller: _subjectController,
                  ),
                ],
              ),
            ),
            SizedBox(height: 16),
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
              children: <Widget>[
                ElevatedButton(
                  onPressed: () async {},
                  child: Text('Enviar Grupo'),
                ),
                ElevatedButton(
                  onPressed: () async {},
                  child: Text('Enviar Todos'),
                ),
              ],
            ),
            SizedBox(height: 100),
            hasText
                ? Text(
                    "O conteúdo copiado não é uma imagem!",
                    style: TextStyle(
                        color: Colors.red, fontWeight: FontWeight.bold),
                  )
                : SizedBox(height: 1),
            !hasImage
                ? Column(children: [
                    ElevatedButton(
                      onPressed: () async {},
                      child: Text('Verificar área de transferência'),
                    ),
                    SizedBox(height: 16),
                    ElevatedButton(
                      onPressed: () async {
                        _getImageFromPicker(); // Here is the function call
                      },
                      child: Text('Escolher da galeria'),
                    ),
                  ])
                : Column(
                    children: [
                      Container(
                        height: heightImg.toDouble(),
                        width: widthImg.toDouble(),
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.all(Radius.circular(10)),
                          image: DecorationImage(
                            image: MemoryImage(_clipboardImage),
                            fit: BoxFit.fill,
                          ),
                        ),
                      ),
                      SizedBox(height: 20),
                      Column(children: [
                        ElevatedButton(
                          onPressed: () async {},
                          child: Text('Verificar área de transferência'),
                        ),
                        SizedBox(height: 16),
                        ElevatedButton(
                          onPressed: () async {
                            _getImageFromPicker(); // Here is the function call
                          },
                          child: Text('Escolher da galeria'),
                        ),
                      ])
                    ],
                  ),
          ],
        ),
      ),
    );
  }
}

here is my flutter doctor

[✓] Flutter (Channel stable, 3.3.10, on macOS 13.2 22D49 darwin-arm, locale pt-BR)
[!] Android toolchain - develop for Android devices (Android SDK version 32.1.0-rc1)
    ✗ cmdline-tools component is missing
      Run `path/to/sdkmanager --install "cmdline-tools;latest"`
      See https://developer.android.com/studio/command-line for more details.
    ✗ Android license status unknown.
      Run `flutter doctor --android-licenses` to accept the SDK licenses.
      See https://flutter.dev/docs/get-started/install/macos#android-setup for more details.
[✓] Xcode - develop for iOS and macOS (Xcode 14.2)
[✓] Chrome - develop for the web
[✓] Android Studio (version 2021.2)
[✓] VS Code (version 1.74.3)
[✓] Connected device (3 available)
[✓] HTTP Host Availability

the pop up supposed to apper

I tried to use older versions of the packages, but still have the same issue. Also, setting the "NSPhotoLibraryUsageDescription" has no effect

Upvotes: 0

Views: 220

Answers (1)

Sade
Sade

Reputation: 1

Can't tell the reason why, but changing

onPressed: () async {
    _getImageFromPicker(); // Here is the function call
}

to

onPressed: () { // removed the async modifier
    _getImageFromPicker(); // Here is the function call
}

Solves the problem! Now the pop up shows up as expected

Upvotes: 0

Related Questions