Flutter image picker won't show up in Android 10 - flutter

I am a beginner in flutter. I was checking to use image_picker in flutter. But When I tried to check image_picker with my Andorid Phone (10) it won't show up. I don't know what happened, I have added android:requestLegacyExternalStorage="true" in AndroidManifest.xml,
still no change, I don't know what to do? Please help me
import 'package:flutter/material.dart';
import 'package:image_picker/image_picker.dart';
import 'package:path/path.dart';
import 'package:path_provider/path_provider.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
visualDensity: VisualDensity.adaptivePlatformDensity,
),
home: MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
#override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
File _fileimage;
final _picker = ImagePicker();
#override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
_fileimage != null
? FileImage(_fileimage)
: Text('No image selected'),
RaisedButton(
onPressed: () => _takePicture,
child: Text('hi'),
)
],
),
),
),
);
}
void _takePicture() async {
final pickedImage = await _picker.getImage(source: ImageSource.gallery);
// if (pickedImage == null) {
// return;
// }
File tmpFile = File(pickedImage.path);
final Directory directory = await getApplicationDocumentsDirectory();
final String path = directory.path;
final String fileName =
basename(pickedImage.path); // Filename without extension
final String fileExtension = extension(pickedImage.path); // e.g.
tmpFile = await tmpFile.copy('$path/$fileName$fileExtension');
setState(() => _fileimage = tmpFile);
}
}

I found problem with your code.
You used 'FileImage' in 'Widget' is required. Because 'FileImage' returns 'ImageProvider', you should use 'Image.file()' instead of 'FileImage'.
import 'dart:io';
import 'package:flutter/material.dart';
import 'package:image_picker/image_picker.dart';
import 'package:path/path.dart';
import 'package:path_provider/path_provider.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
visualDensity: VisualDensity.adaptivePlatformDensity,
),
home: MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
#override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
File _fileimage;
final _picker = ImagePicker();
#override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
_fileimage != null
? Image.file(_fileimage)
: Text('No image selected'),
RaisedButton(
onPressed: () async {
_takePicture();
},
child: Text('hi'),
)
],
),
),
),
);
}
void _takePicture() async {
final pickedImage = await _picker.getImage(source: ImageSource.gallery);
// if (pickedImage == null) {
// return;
// }
File tmpFile = File(pickedImage.path);
final Directory directory = await getApplicationDocumentsDirectory();
final String path = directory.path;
final String fileName =
basename(pickedImage.path); // Filename without extension
final String fileExtension = extension(pickedImage.path); // e.g.
tmpFile = await tmpFile.copy('$path/$fileName$fileExtension');
setState(() => _fileimage = tmpFile);
}
}

Related

my widget didn't rebuild when remove item from list unless make hot-reload for project

my project about Build music App using flutter-provider and packages name (on_audio_query) so when I get all songs from storage and want to modified them, like remove or add item the widget didn't rebuild automatically the update happened in console only unless press hot-reload to all project and the list has update and can review my code below.
main.dart
import 'package:flutter/material.dart';
import 'package:music_app_v4/test_folder/home_screen.dart';
import 'package:music_app_v4/test_folder/home_model.dart';
import 'package:provider/provider.dart';
void main() {
runApp(MultiProvider(providers: [
ChangeNotifierProvider<HomeModel>(create: (context) => HomeModel()),
],
child: const MyApp(),));
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
#override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: const MyHomePage(title: 'Flutter List Songs'),
);
}
}
HomeScreen.dart
import 'dart:io';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:music_app_v4/test_folder/home_model.dart';
import 'package:on_audio_query/on_audio_query.dart';
import 'package:provider/provider.dart';
class MyHomePage extends StatefulWidget {
const MyHomePage({super.key, required this.title});
final String title;
#override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
final OnAudioQuery _onAudioQuery = OnAudioQuery();
#override
void initState() {
requestStoragePermission();
super.initState();
}
void requestStoragePermission() async {
try {
if (!kIsWeb) {
bool status = await _onAudioQuery.permissionsStatus();
if (!status) {
await _onAudioQuery.permissionsRequest().then((value) => HomeModel());
}
setState(() {});
}
} catch (e) {
const SocketException.closed();
rethrow;
}
}
#override
Widget build(BuildContext context) {
//var notify = Provider.of<HomeModel>(context,listen: false);
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Consumer<HomeModel>(builder: (context,notify,child){
return FutureBuilder<List<SongModel>>(
future: _onAudioQuery.querySongs(ignoreCase: false),
builder: (context,AsyncSnapshot item) {
if (item.data == null) {
return const Center(
child: CircularProgressIndicator(),
);
} else if (item.data!.isEmpty) {
return const Center(
child: Text('No found Data'),
);
}
List<SongModel> songs = item.data!;
return ListView.builder(
itemCount: songs.length,
itemBuilder: (context, index) {
return Row(
children: [
Expanded(
child: ListTile(
title: Text(songs[index].title),
),
),
GestureDetector(
onTap: () {
// setState(() {
// _audioEdit.deleteAudio(songs[index].data);
// });
notify.removeAudio(songs[index].data);
print('button pressed');
//_audioEdit.deleteAudio(songs[index].data);
},
child: Icon(Icons.remove_circle))
],
);
},
);
},
);
},),
);
}
}
HomeModel.dart
import 'package:flutter/material.dart';
import 'package:on_audio_edit/on_audio_edit.dart';
import 'package:on_audio_query/on_audio_query.dart';
class HomeModel extends ChangeNotifier{
final OnAudioEdit _audioEdit = OnAudioEdit();
final OnAudioQuery onAudioQuery = OnAudioQuery();
List<SongModel>? songs;
void removeAudio(dynamic data){
_audioEdit.deleteAudio(data);
notifyListeners();
}
}

Displaying a created PDF in a new tab for flutter web

I am currently creating a PDF to display inputted data from the user and I want to display the pdf in a new tab so they can either print it or download it or just close out.
The current PDF creation method is:
Future<void> createPDF() async{
final PdfDocument document = PdfDocument();
document.pages.add().graphics.drawString(
'Hello World!', PdfStandardFont(PdfFontFamily.helvetica, 20),
brush: PdfSolidBrush(PdfColor(0, 0, 0)),
bounds: Rect.fromLTWH(20, 60, 150, 30));
List<int> bytes = await document.save();
document.dispose();
saveAndLaunchFile(bytes, '$NewConfig.pdf');
}
then to open the file I have this method:
Future<void> saveAndLaunchFile(List<int> bytes, String fileName) async {
Uint8List test = Uint8List.fromList(bytes);
final pdfController = PdfController(document:PdfDocument.openData(test));
PdfView(controller: pdfController);
}
The issue I am running into is the new tab that opens displays this:
37806870454946551310371311462502541310493248321119810613106060131047841211121013247679711697108111103131047809710310111532503248328213106262131010111010011198106131050324832111981061310606013104784121112101324780971031011151310477510510011532915132483282931310476711111711011632491310478210111511111711499101115326060626213101310477710110010597661111203291483248325357533256525093131062621310101110100111981061310513248321119810613106060131047671111171101163249131047841211121013247809710310111513104775105100115329152324832829313104780971141011101163250324832821310626213101011101001119810613105232483211198106131060601310478412111210132478097103101131047809711410111011632513248328213104767111110116101110116115329153324832823254324832823255324832829313104782101115111117114991011153260601310478011411199831011163291478068703247841011201169313104770111110116326060131047994998565353545345534851514552101565345985399504553565154485748981015048513256324832821310626213101310626213101310626213101011101001119810613105332483211198106131060601310477010510811610111432477010897116101681019911110010113104776101110103116104325713106262131011511611410197109131012094434001140114131010111010011511611410197109131010111010011198106131054324832111981061310606013104770105108116101114324770108971161016810199111100101131047761011101031161043257131062621310115116114101971091310120941140082082131010111010011511611410197109131010111010011198106131055324832111981061310606013104770105108116101114324770108971161016810199111100101131047761011101031161043250505713106262131011511611410197109131012094101143657534916133239129252135241322146718217921720554949169175213642071871051869320038539138254122147698014597301321532472302034337215176592471105216061243225561856225136314915325146710778105157252165162164620485841822824418812023711612918515227228989410517881108111961551426748148156415712843203422444621814625525521417525223914411496171408922315518373155231199452369425460117164423832424364215131201621976962111762147219361615719178233240147195177114221341688311317017616894244613148201231158207322789229127168204178122502141225624896143871835514860100184613795972178011310101110100115116114101971091310101110100111981061310563248321119810613106060131047841211121013247701111101161310478311798116121112101324784121112101491310476697115101701111101163247721011081181011161059997131047691109911110010511010332478710511065110115105691109911110010511010313106262131010111010011198106131012011410110213104832571310484848484848484848483254535351533210213104848484848484848495532484848484832110131048484848484848485550324848484848321101310484848484848484956483248484848483211013104848484848484850535732484848484832110131048484848484848525256324848484848321101310484848484848485351543248484848483211013104848484848484854505232484848484832110131048484848484848575152324848484848321101310116114971051081011141310606013104782111111116324932483282131047831051221013257131062621310131011511697114116120114101102131049485157131037376979701310
which I am guessing is the bytes but am at a loss as to what I am supposed to do from here.
any info?
I suggest you to directly use a pub package like native_pdf_view.
Its easyer than your method in my opinion and you dont need to reinvente the wheel.
EDIT:
Here is a code that i do quickly, it can be improve with a ChangeNotifier etc... to handle Future function, But it work.
main.dart
import 'dart:typed_data';
import 'package:flutter/material.dart';
import 'package:native_pdf_view/native_pdf_view.dart';
import 'package:syncfusion_flutter_pdf/pdf.dart' as scPdf;
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: const MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({super.key, required this.title});
final String title;
#override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
late PdfController _pdfController;
bool isPdfLoaded = false;
Future<void> createPDF() async{
final scPdf.PdfDocument document = scPdf.PdfDocument();
document.pages.add().graphics.drawString(
'Hello World!', scPdf.PdfStandardFont(scPdf.PdfFontFamily.helvetica, 20),
brush: scPdf.PdfSolidBrush(scPdf.PdfColor(0, 0, 0)),
bounds: Rect.fromLTWH(20, 60, 150, 30));
List<int> bytes = await document.save();
document.dispose();
saveAndLaunchFile(bytes, 'test.pdf');
}
Future<void> saveAndLaunchFile(List<int> bytes, String fileName) async {
Uint8List test = Uint8List.fromList(bytes);
final pdfController = PdfController(document:PdfDocument.openData(test));
setState(() {
isPdfLoaded = true;
_pdfController = pdfController;
});
}
#override
Widget build(BuildContext context) {
var size = MediaQuery.of(context).size;
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
const Text(
'PDF',
),
isPdfLoaded ? Container(width : size.width, height: size.height * 0.5, child : PdfView(controller: _pdfController)) : Text("Pdf not loaded"),
],
),
),
floatingActionButton: FloatingActionButton(
onPressed: createPDF,
tooltip: 'CreatePDF',
child: const Icon(Icons.add),
), // This trailing comma makes auto-formatting nicer for build methods.
);
}
}
Re-EDIT:
This is the exemple using Navigator.push to display the pdf in another page:
main.dart
import 'dart:typed_data';
import 'package:flutter/material.dart';
import 'package:native_pdf_view/native_pdf_view.dart';
import 'package:stackoverflow/pdf_view.dart';
import 'package:syncfusion_flutter_pdf/pdf.dart' as scPdf;
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: const MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({super.key, required this.title});
final String title;
#override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
late PdfController _pdfController;
bool isPdfLoaded = false;
Future<void> createPDF() async{
final scPdf.PdfDocument document = scPdf.PdfDocument();
document.pages.add().graphics.drawString(
'Hello World!', scPdf.PdfStandardFont(scPdf.PdfFontFamily.helvetica, 20),
brush: scPdf.PdfSolidBrush(scPdf.PdfColor(0, 0, 0)),
bounds: Rect.fromLTWH(20, 60, 150, 30));
List<int> bytes = await document.save();
document.dispose();
saveAndLaunchFile(bytes, 'test.pdf');
}
Future<void> saveAndLaunchFile(List<int> bytes, String fileName) async {
Uint8List test = Uint8List.fromList(bytes);
final pdfController = PdfController(document:PdfDocument.openData(test));
await Navigator.of(context).push((MaterialPageRoute(builder: (context) => PdfViewPage(pdfController: pdfController))));
}
#override
Widget build(BuildContext context) {
var size = MediaQuery.of(context).size;
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
const Text(
'Click on Floating button to create and open your pdf in another view',
),
],
),
),
floatingActionButton: FloatingActionButton(
onPressed: createPDF,
tooltip: 'CreatePDF',
child: const Icon(Icons.add),
), // This trailing comma makes auto-formatting nicer for build methods.
);
}
}
pdf_view.dart
import 'package:flutter/material.dart';
import 'package:native_pdf_view/native_pdf_view.dart';
class PdfViewPage extends StatelessWidget {
const PdfViewPage({Key? key, required this.pdfController}) : super(key: key);
final PdfController pdfController;
#override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: PdfView(controller: pdfController)
),
);
}
}

Google maps wont open using URL launcher in Flutter

I'm very new to flutter.
I've created an app that should open up google maps on click but it wont open.
Please help me out.
forMap.dart file (This is the file which has the method to launch google maps):
import 'package:url_launcher/url_launcher.dart';
class MapUtils {
MapUtils._();
static Future<void>openMap(double latitude,double longitude) async {
String googleUrl = 'https://www.google.com/maps/search/?api=1&query=$latitude,$longitude';
if(await canLaunch(googleUrl) != null) {
await canLaunch(googleUrl);
} else {
throw 'Could not open the map.';
}
}
}
main.dart file (This is the file which will use the method of the forMap.dart file and launch it):
import 'package:flutter/material.dart';
import 'forMap.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
// This widget is the root of your application.
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
visualDensity: VisualDensity.adaptivePlatformDensity,
),
home: MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
#override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
InkWell(
onTap: (){
MapUtils.openMap(38.8977,77.0365);
},
child: Text('get map'),
),
],
),
),
);
}
}
It is because you have incorrectly calling a function. You're using await canLaunch(googleUrl); instead of await launch(googleUrl); in the if part.
So, your code should be like this:
static Future<void> openMap(double latitude,double longitude) async {
String googleUrl = 'https://www.google.com/maps/search/?api=1&query=$latitude,$longitude';
if(await canLaunch(googleUrl) != null) {
await launch(googleUrl);
} else {
throw 'Could not open the map.';
}
}
You probably don't need to use Future<void> so, change the function name to:
static void openMap(double latitude,double longitude) async {
...
}

ImagePickerWeb Output is File$ instead of File

I am using ImagePickerWeb to allow users to upload photos from my app
Future<void> getPhotos() async {
var imageFile = await ImagePickerWeb.getImage(outputType: ImageType.file);
print(imageFile);
if (imageFile != null) {
setState(() {
currentSelfie = imageFile;
_accDetails['customer_selfie'] = currentSelfie;
});
}
When I try to display the image via Image.File
Image.file(
currentSelfie,
height: screenAwareSize(100, context),
width: screenAwareSize(100, context),
fit: BoxFit.fill,
),
I get this error
File$ ([object File]) :<getObject: NoSuchMethodError: The
getter 'uri' was called on null.>
I am using the file format for my because I am passing the image to my back end server and it receives the data as a file. Any help would be appreciated.
You can copy paste run full code below
According to owner's description https://github.com/Ahmadre/image_picker_web#how-do-i-get-all-informations-out-of-my-imagevideo-eg-image-and-file-in-one-run
You can use ImagePickerWeb.getImageInfo and show image with Image.memory
code snippet
Future<void> getPhotos() async {
var mediaData = await ImagePickerWeb.getImageInfo;
String mimeType = mime(Path.basename(mediaData.fileName));
html.File mediaFile =
new html.File(mediaData.data, mediaData.fileName, {'type': mimeType});
print("imageFile ${mediaData.toString()}");
if (mediaData != null) {
currentSelfie = mediaData.data;
setState(() {});
}
}
...
currentSelfie == null
? Container()
: Image.memory(
(currentSelfie),
fit: BoxFit.fill,
),
working demo
full code
import 'dart:async';
import 'dart:io';
import 'package:mime_type/mime_type.dart';
import 'package:path/path.dart' as Path;
import 'package:flutter/material.dart';
import 'package:image_picker_web/image_picker_web.dart';
import 'dart:html' as html;
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
visualDensity: VisualDensity.adaptivePlatformDensity,
),
home: MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
#override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
var currentSelfie;
Future<void> getPhotos() async {
var mediaData = await ImagePickerWeb.getImageInfo;
String mimeType = mime(Path.basename(mediaData.fileName));
html.File mediaFile =
new html.File(mediaData.data, mediaData.fileName, {'type': mimeType});
print("imageFile ${mediaData.toString()}");
if (mediaData != null) {
currentSelfie = mediaData.data;
setState(() {});
}
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
currentSelfie == null
? Container()
: Image.memory(
(currentSelfie),
fit: BoxFit.fill,
),
],
),
),
floatingActionButton: FloatingActionButton(
onPressed: getPhotos,
tooltip: 'Increment',
child: Icon(Icons.add),
),
);
}
}

How to get a picked file to show in a another widget

I wanted to build a feature where a user will be typing texts then may wanted to add a file, pick an image then the picked image will now be returned at the original text screen with the texts there too. I have develop the feature for inputting the texts my text feature then i am stuck at how the picked image will be returned to that same text place. Please how can i get this feature?
First You Need to Add dependencies image_picker: ^0.6.4 Used the latest version, Second
pickup an image
class _MyHomePageState extends State<MyHomePage> {
File _iamge;
Future CameraImage() async{
var iamge =await ImagePicker.pickImage(source: ImageSource.gallery);
setState(() {
_iamge = iamge;
});
}
Here Is Full Code To know Better Understand.
import 'dart:io';
import 'package:flutter/material.dart';
import 'package:image_picker/image_picker.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
#override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
File _iamge;
Future CameraImage() async{
var iamge =await ImagePicker.pickImage(source: ImageSource.gallery);
setState(() {
_iamge = iamge;
});
}
#override
Widget build(BuildContext context) {
return Scaffold(
body: Column(
children: <Widget>[
Container(
height: 500,
width: double.infinity,
color: Colors.blue,
child: _iamge==null?Center(child: Text("NO Image
Select")):Image.file(_iamge),
),
Divider(),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
FloatingActionButton(onPressed: (){
CameraImage();
},child: Icon(Icons.camera),),
SizedBox(width: 20,),
FloatingActionButton(onPressed: (){},
child: Icon(Icons.photo_library),),
],
)
],
),
);
}
}
receive.dart
import 'package:flutter/material.dart';
import 'package:flutterapp/data.dart';
import 'package:provider/provider.dart';
class ReceiveData extends StatelessWidget {
#override
Widget build(BuildContext context) {
final providerdata= Provider.of<Data>(context);
return Scaffold(
body: Center(
child:
Text(providerdata.value.toString(),style:TextStyle(fontSize:50),),
),
);
}
}