How to check list of selected images BindableLayout in Xamarin - xamarin

Question

I'm trying to upload images in Xamarin to Server via API.
.xaml
<Grid x:Name="pickimg" Grid.Row="0" Grid.Column="1" HorizontalOptions="End" VerticalOptions="Center">
<StackLayout Orientation="Horizontal">
<Image Margin="0">
<Image.Source>
<FontImageSource Color="#ddd" Size="22" FontFamily="MaterIcon" Glyph="{x:Static local:FontIconsClass.Camera}"/>
</Image.Source>
</Image>
</StackLayout>
<Grid.GestureRecognizers>
<TapGestureRecognizer Tapped="pickimg_Tapped" />
</Grid.GestureRecognizers>
</Grid>
<StackLayout HorizontalOptions="FillAndExpand">
<StackLayout x:Name="listImg" Orientation="Horizontal">
<BindableLayout.ItemTemplate>
<DataTemplate>
<Frame HasShadow="False" Padding="0" IsClippedToBounds="True" CornerRadius="4">
<Image HeightRequest="70" WidthRequest="70" Aspect="AspectFill" Source="{Binding .}"/>
</Frame>
</DataTemplate>
</BindableLayout.ItemTemplate>
</StackLayout>
</StackLayout>
.xaml.cs
This is how I display the list of selected photos:
async void pickimg_Tapped(System.Object sender, EventArgs e)
{
var pickResult = await MediaGallery.PickAsync(5, MediaFileType.Image);
if(pickResult?.Files == null)
{
return;
}
else
{
var imgList = new List<ImageSource>();
foreach (var img in pickResult?.Files)
{
var stream = await img.OpenReadAsync();
imgList.Add(ImageSource.FromStream(() => stream));
}
BindableLayout.SetItemsSource(listImg, imgList);
}
}
Everything seems fine. And I have 1 button to post the image to the Server:
private async void bt_addfeed_Clicked(object sender, EventArgs e)
{
var getResult = listImg;//How can I check and get the list of images in listImg?
if(getResult == null)
{
return;
}
else
{
var content = new MultipartFormDataContent();
content.Add(new StreamContent(await getResult.OpenReadAsync()), "file", getResult.FileName);
var httpClient = new HttpClient();
var response = await httpClient.PostAsync("", content);......
}
}
How can I check and get the list of images in listImg? Please solutions, Thanks
Update...
List<ImageSource> imgList = new List<ImageSource>();
async void pickimg_Tapped(System.Object sender, EventArgs e)
{
var pickResult = await MediaGallery.PickAsync(5, MediaFileType.Image);
if(pickResult?.Files == null)
{
return;
}
else
{
foreach (var img in pickResult?.Files)
{
var stream = await img.OpenReadAsync();
imgList.Add(ImageSource.FromStream(() => stream));
}
BindableLayout.SetItemsSource(listImg, imgList);
}
}
private async void bt_addfeed_Clicked(object sender, EventArgs e)
{
var getResult = imgList;
if(getResult == null)
{
return;
}
else
{
var content = new MultipartFormDataContent();
content.Add(new StreamContent(await getResult.OpenReadAsync()), "file", getResult.FileName);
var httpClient = new HttpClient();
var response = await httpClient.PostAsync("", content);......
}
}
How can getResult get .FileName and .OpenReadAsync()?
content.Add(new StreamContent(await getResult.OpenReadAsync()), "file", getResult.FileName);

Answer 1

you are declaring imgList as a local variable, so it only has scope inside the method where you declare it
var imgList = new List<ImageSource>();
instead, declare it as a class level variable so it will be accessible throughout the page
// do this inside the class body, but NOT within a specific method
List<ImageSource> imgList = new List<ImageSource>();