Flutter Windows Desktop Tutorial - Open File Dialog with File Picker

in this video we're going to add a file open dialog window to your flutter windows app using the file picker package so let's jump right into it we're going to go ahead and get this change this to open file app we'll do a stateless widget here then we'll add our material app we'll go ahead and call an open file app home here [Music] we'll create one more stateless widget down here this one will be called open file app home then we'll do a scaffold a center an elevated button we'll just say open file and then we'll add a known pressed we'll add our const here [Music] and a const here [Music] run that so here we go but nothing's happening at the moment next thing we're going to do is go ahead and add the file picker package so we'll go into the terminal and we'll type in flutter pub add file picker if it worked correctly you should see it in your pub spec yaml file we'll import it here at the top [Music] now once you add the plugin you may see an error that says building with plugins requires sim link support to get rid of that message you need to enable developer mode on your windows system so you can do that by going to the start button going into settings you'll go to update and security you'll go to for developers and then you'll enable developer mode right here so now at the top of open file app home we're going to add a method we'll just call it pick file [Music] and in here we're just going to call pick files from file picker [Music] and then in the on pressed we need to call that method so now when we click open file it should open up for us now we're going to grab the file that you select with the dialog window and print it to the console so we can see how that works inside our pickfile method we're going to first do this line [Music] and what this is saying is if result equals null that means that they didn't make a selection and we can just exit out of pic file now we'll grab the file information [Music] and then i'm just going to print that to the console [Music] so we open the window we'll just pick this readme file here and there we can see that it printed the path and file name into the console now i just chose path because i wanted the full path and file name but there's actually a few other options if you want to do something else file picker also has support for multiple files we just need to make a few modifications first inside here we'll add something and then we'll remove these two lines here and do this [Music] so since multiple files are going to be coming through the pic files results now we'll just iterate through those results and display each file separately so i'll open the file and i'll click this and this and hit open and you'll see both of those displayed properly there's a few other things that you can configure within pic files you can set the dialog title [Music] so when we open the file you'll see it now says select a file for our app up here you can say you only want certain types [Music] you'll see now that only video types are showing and if you want to get even more specific you can use custom here [Music] you'll see that those are the only options now and just like with file you have a few other options if you want something different so that should get you an open file dialog window in your flutter windows app in a future video we'll look at saving that file in various locations you might also take a look at this video and if you're enjoying this video and would like to see more please consider subscribing thanks and i hope to see you in the next one

Channel: Learn Flutter with Me

Views: 8,132

Keywords: flutter file picker, multiple file picker tutorial, flutter image picker, file picker in flutter, image picker flutter, multi image picker flutter, flutter file picker example, file picker, flutter dialog, flutter popup dialog, flutter file picker tutorial, flutter for windows, flutter desktop, flutter desktop windows, filepicker, flutter, flutter tutorial

Id: CMYErzgDNAE

Length: 6min 46sec (406 seconds)

Published: Wed Feb 16 2022