Hello Folks,
I'm trying to figure out one issue where image disappeared after tapping it on grid. Basically I'm using rg.plugins popup to pop up an image while tapping it on grid. Please take a look at screen shots and code. Any idea what's happening? Where I'm making mistakes?
ScreenShots:
Code Behind :
private async void BtnPhoto_Clicked(object sender, EventArgs e)
{
byte[] imageAsBytes;
if (!CrossMedia.Current.IsCameraAvailable || !CrossMedia.Current.IsTakePhotoSupported)
{
await DisplayAlert("No Camera", ":( No camera avaialble.", "OK");
return;
}
var file = await CrossMedia.Current.TakePhotoAsync(new Plugin.Media.Abstractions.StoreCameraMediaOptions() { });
if (file == null) return;
var alpha = new Image
{
Source = ImageSource.FromStream(() => { return file.GetStream(); }),
WidthRequest = 200,
HeightRequest = 200
};
if (col == 0) grdLayout.RowDefinitions.Add(new RowDefinition { Height = new GridLength(200, GridUnitType.Absolute) });
grdLayout.ColumnDefinitions.Add(new ColumnDefinition
{
Width = new GridLength(200, GridUnitType.Absolute)
});
grdLayout.Children.Add(alpha, col, row);
col++;
if (col == 2) { col = 0; row++; }
using (var memoryStream = new MemoryStream())
{
file.GetStream().CopyTo(memoryStream);
file.Dispose();
imageAsBytes = memoryStream.ToArray();
}
//Insert photos in DB and fetch info from DB at same time
//Store images in byte array, then upload to Grid
await App.FrendelSOAPService.InsertInstallerImages(CSID, imageAsBytes, RoomNo, RoomName);
}
public async void GetInstallerImages(){
indicator.IsRunning = true;
indicator.IsVisible = true;
grdLayout.Children.Add(indicator, 0, 0);
Grid.SetColumnSpan(indicator, 2);
byte[][] lstByteArryImages = await App.FrendelSOAPService.GetInstallerImages(RoomNo);
TotalImages = lstByteArryImages.Count();
foreach(var imageBytes in lstByteArryImages){
var newImage = new Image
{
Source = ImageSource.FromStream(() => new MemoryStream(imageBytes)),
WidthRequest = 200,
HeightRequest = 200
};
TapGestureRecognizer tapGestureRecognizer = new TapGestureRecognizer
{
Command = new Command(OnGridImageTapped),
CommandParameter = newImage
};
newImage.GestureRecognizers.Add(tapGestureRecognizer);
if (col == 0) grdLayout.RowDefinitions.Add(new RowDefinition { Height = new GridLength(200, GridUnitType.Absolute) });
grdLayout.ColumnDefinitions.Add(new ColumnDefinition
{
Width = new GridLength(200, GridUnitType.Absolute)
});
grdLayout.Children.Add(newImage, col, row);
col++;
if (col == 2) { col = 0; row++; }
}
//Calculation for Rows
if (TotalImages % 2 == 0) row = TotalImages / 2;
else {
row = (TotalImages / 2) + 1;
col = 1;
row--; //row always starts from 0, so if row = 2 it means starts from (0, 1) = 2 , same like index
}
indicator.IsRunning = false;
indicator.IsVisible = false;
btnCamera.IsEnabled = true;
} //End of Method
private async void OnGridImageTapped(object obj)
{
Image img = new Image();
img = obj as Image;
img.WidthRequest = 400;
img.HeightRequest = 500;
img.Aspect = Aspect.AspectFill;
await PopupNavigation.Instance.PushAsync(new ImagePopUp(img));
//await Navigation.PushPopupAsync(new ImagePopUp(img));
}
Image Pop Up XAML File :
`<?xml version="1.0" encoding="utf-8" ?>
<pages:PopupPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:pages="clr-namespace:Rg.Plugins.Popup.Pages;assembly=Rg.Plugins.Popup"
xmlns:animations="clr-namespace:Rg.Plugins.Popup.Animations;assembly=Rg.Plugins.Popup"
x:Class="InstallerAppForms.ImagePopUp">
<pages:PopupPage.Animation>
<animations:ScaleAnimation
PositionIn="Center"
PositionOut="Center"
ScaleIn="1.2"
ScaleOut="0.8"
DurationIn="400"
DurationOut="300"
EasingIn="SinOut"
EasingOut="SinIn"
HasBackgroundAnimation="False"/>
</pages:PopupPage.Animation>
<StackLayout Padding="20, 20, 20, 20"
VerticalOptions="Center"
HorizontalOptions="Center"
x:Name="slImagePopUp">
</StackLayout>
</pages:PopupPage>`
Image Pop Up Code Behind :
`public partial class ImagePopUp : PopupPage
{
public ImagePopUp(Image img)
{
InitializeComponent();
slImagePopUp.Children.Add(img);
}
protected override void OnAppearing()
{
base.OnAppearing();
}
protected override void OnDisappearing()
{
base.OnDisappearing();
}
// ### Methods for supporting animations in your popup page ###
// Invoked before an animation appearing
protected override void OnAppearingAnimationBegin()
{
base.OnAppearingAnimationBegin();
}
// Invoked after an animation appearing
protected override void OnAppearingAnimationEnd()
{
base.OnAppearingAnimationEnd();
}
// Invoked before an animation disappearing
protected override void OnDisappearingAnimationBegin()
{
base.OnDisappearingAnimationBegin();
}
// Invoked after an animation disappearing
protected override void OnDisappearingAnimationEnd()
{
base.OnDisappearingAnimationEnd();
}
protected override Task OnAppearingAnimationBeginAsync()
{
return base.OnAppearingAnimationBeginAsync();
}
protected override Task OnAppearingAnimationEndAsync()
{
return base.OnAppearingAnimationEndAsync();
}
protected override Task OnDisappearingAnimationBeginAsync()
{
return base.OnDisappearingAnimationBeginAsync();
}
protected override Task OnDisappearingAnimationEndAsync()
{
return base.OnDisappearingAnimationEndAsync();
}
// ### Overrided methods which can prevent closing a popup page ###
// Invoked when a hardware back button is pressed
protected override bool OnBackButtonPressed()
{
// Return true if you don't want to close this popup page when a back button is pressed
return base.OnBackButtonPressed();
}
// Invoked when background is clicked
protected override bool OnBackgroundClicked()
{
// Return false if you don't want to close this popup page when a background of the popup page is clicked
return base.OnBackgroundClicked();
}
}`