Flutter web doesn't recognise pdf file format - flutter

I'm trying to show the pdf file when pushing the button but no success so far. Can there be the reason that the format of the pdf file has that question mark on the icon meaning the framework doesn't recognise the format?

No, the Assets folder can contain any file regardless of the file extension. Have you define your assets folder in pubspec.yaml like this?
assets:
- assets/pdf/
If yes you can use native_pdf_view library as it supports asset loading as well as full screen. You should be able to implement it as follows:
final pdfController = PdfController(
document: PdfDocument.openAsset('assets/copy.pdf'),
);
return Scaffold(
body: Center(
child: PdfView(
controller: pdfController,
)
),
);
Original link to the post is here.

Related

Flutter Web deployed - How to display a pdf file in a new tab from assets folder

As the title suggests, I can't open a .pdf file from my project's assets folder in a new browser tab. This thing happens to me only in the deployed version of my web app, locally it works.
Thi is the part of the code that I need to work:
TextButton(
onPressed: () async {
var bytes = await rootBundle.load("assets/files/test.pdf"); // location of your asset file
final blob = html.Blob([bytes], 'application/pdf');
final url = html.Url.createObjectUrlFromBlob(blob);
html.window.open(url, "_blank");
html.Url.revokeObjectUrl(url);
},
child: Text(
"OPEN PDF.",
style: AppTextStyles.DIALOG_CONTENT_TEXT_STYLE.copyWith(fontSize: 11),
))
Simply, by clicking on the text I want to open the pdf file saved in the assets folder in a new tab. I have already entered the path of the assets folder inside pubspec.yaml.
Can anyone help me? I have found various solutions that work for Android and IOS, but unfortunately not for the web...

Display PDF or PPT files in the Flutter App

I want to show my PDF and PPT files within the app without using any other app in Flutter.
Not from the local assets but from web Urls.
For PDF you can use this package: https://pub.dev/packages/advance_pdf_viewer
Example:
Load from URL
PDFDocument doc = await PDFDocument.fromURL(yourURL);
Container(
child: PDFViewer(document: doc)),
);

Flutter image is not showing

I want to show some local image and display it on the screen like this:
Image(image: AssetImage('assets/images/addFood.png'))
But I cannot see the image on the screen and I am getting no error at all.
Here is what I have done:
In my pubspec.yaml I have added my image folder like this:
assets:
- lib/assets/images/
The image named "addFood" is inside images folder as you can see here:
I want to display a simple text with image under it, I can see the text on the screen and I am doing it like this:
Widget build(BuildContext context) {
if (favoriteMeals.isEmpty)
return Column(children: <Widget>[
Text('no favorites',style: Theme.of(context).textTheme.title,),
Image(image: AssetImage('assets/images/addFood.png'))
]);
else{
......
......
......
}
All I can see is the text without the image:
solutions that did not help in my case:
AssetImage is not not displaying image in flutter app
Adding assets and images
mage Not Appearing when Using "new Image.asset" inside a Column
How can I fix it and make sure that the image will be displayed on the screen?
You need to provide the full path for an asset when accessing it within the code. Nothing is implied when accessing the assets. Your actual path is lib/assets/images/, but you only do assets/images/. Change your code to include this:
Image(image: AssetImage('lib/assets/images/addFood.png'))
It should be
flutter:
assets:
- assets/images/
Remove lib from pubspec.yaml path. And to get image in code use,
Image.asset('assets/images/lake.jpg')
Update pubspec.yaml file like this
assets:
- directory/subdirectory/

How to add images in vscode - Flutter

I am trying to add images to an asset folder in VSCode, but I only get the option to type the image name. When I do and click on the newly created image, it says "an error has occurred." I presume this is because I am only typing the file name, not adding the actual image.
I added the full path to the yml file, but nothing loads in the app.
assets:
- C:/Users/tt/Desktop/Flutter_projects/Practise/imaages/images/assets/android.png
Flutter code:
child: Image(
image: AssetImage('assets/android.png')
),
),
use relative path to indicate the folder(e.g.myImages) that hosts your image assets.
then
flutter:
assets:
- myImages/android.png
see flutter doc for more info:
Adding assets and images

How to use flare binary files in a flutter app?

How can I use flare binary files (.flr) in my flutter app?
FlareActor(
"location/00.flr",
alignment: Alignment.center,
fit: BoxFit.contain,
animation: // "here you set the name of the animations tab",
),
for example here https://www.2dimensions.com/a/pollux/files/flare/success-check
the name of animation is Untitled
How about you check the docs https://pub.dev/packages/flare_flutter
You can create your own flare file by signing in on https://www.2dimensions.com/
if your currently trying experimenting with someone else's flare file.
Assuming that you have an existing project,
Add the package to your project's dependencies (pubspec.yaml)
Check the docs(above link) and see which files you really need and import them accordingly
import 'package:flarecode/flare_actor.dart';
You'll surely need the above one.
Paste the files within your project directory and don't forget to mention it in pubspec.yaml.
(Optional)
Make sure you have some way to trigger the animation using FlareController (Raised Animation or as soon as the widget is built)
Example Code:
Container(
FlareActor(
"assets/yourflare",
alignment:Alignment.center,
fit:BoxFit.contain,
animation:"idle" /* Default_Animation_Name (One Flare file can hold multiple flare animations with the same name) */ ) );