Cannot Render other images from database

ma12rkyma12rky Member ✭✭✭

Hi Xamarin Forum,
Can somebody help me here im little stuck at rendering my other images from my database Here is my Code

PostModel.cs

public class Post
    {
        public int Id { get; set; }
        public string Uploader { get; set; }
        public string OwnersEmail { get; set; }
        public DateTime dateUpload { get; set; }
        public string PhotoSource { get; set; }
        public string PhotoSource2 { get; set; }
        public string PostContent { get; set; }
        public string OwnersPhoto { get; set; }
        public ImageSource Photo
        {

            get
            {
                byte[] bytes = Convert.FromBase64String(PhotoSource);
                MemoryStream ms = new MemoryStream(bytes);
                ImageSource s = ImageSource.FromStream(() => ms);
                return s;
            }
            set
            {

            }
        }
        public ImageSource Photo2
        {

            get
            {
                byte[] bytes = Convert.FromBase64String(PhotoSource);
                MemoryStream ms = new MemoryStream(bytes);
                ImageSource s = ImageSource.FromStream(() => ms);
                return s;
            }
            set
            {

            }
        }

    }

Xaml

 <StackLayout>
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"/>
                </Grid.ColumnDefinitions>
                <StackLayout>
                    <StackLayout Spacing="0" VerticalOptions="Start" Orientation="Horizontal">
                        <StackLayout.Margin>
                            <OnPlatform x:TypeArguments="Thickness">
                                <On Platform="iOS" Value="0,12,0,0" />
                                <On Platform="Android" Value="0,15,0,0" />
                            </OnPlatform>
                        </StackLayout.Margin>
                    </StackLayout>
                </StackLayout>
            </Grid>
            <Frame HorizontalOptions="Fill" Grid.Column="0" Grid.Row="0" HeightRequest="20" BackgroundColor="Black" Margin="0,-25,0,25">
                <Image Source="back_white.png" HeightRequest="40" WidthRequest="40" HorizontalOptions="Start">
                    <Image.GestureRecognizers>
                        <TapGestureRecognizer Tapped="BackFunction"/>
                    </Image.GestureRecognizers>
                </Image>
            </Frame>
            <StackLayout Margin="10,5,10,0">
                <StackLayout>
                    <Image Source="{Binding Photo}" HeightRequest="200" Aspect="AspectFill" />
                    <StackLayout Orientation="Horizontal" Margin="5,5,10,10">
                        <Image Source="{Binding Photo_2}" HeightRequest="70" WidthRequest="70" Margin="0,0,5,0" />
                        <!--<Image Source="{Binding Photo3}" HeightRequest="70" WidthRequest="70" Aspect="AspectFill" Margin="0,0,5,0" />
                        <Image Source="{Binding Photo4}" HeightRequest="70" WidthRequest="70" Aspect="AspectFill" Margin="0,0,5,0" />-->
                    </StackLayout>
                </StackLayout>
                <Label Text="{Binding HouseName}" HorizontalOptions="Start" FontSize="16"/>
                <Label Text="Details" Margin="0,15,0,0"/>
                <ScrollView>
                    <StackLayout>
                        <Label Text="{Binding PostContent}" FontSize="15"/>
                        <StackLayout Orientation="Horizontal">
                            <Label Text="Contact"/>
                            <Label Text="{Binding Uploader}" TextColor="Blue" x:Name="ownerName">
                                <Label.GestureRecognizers>
                                    <TapGestureRecognizer Tapped="ContactOwner"/>
                                </Label.GestureRecognizers>
                            </Label>
                        </StackLayout>
                    </StackLayout>
                </ScrollView>
            </StackLayout>
        </StackLayout>

CodeBehind

public partial class PostDetailPage : ContentPage
    {
        Post SelectedPost;
        public List<Post> postPhotos;
        public PostDetailPage (Post PostItem)
        {
            this.SelectedPost = PostItem;
            InitializeComponent ();
            BindingContext = SelectedPost;
            BindPhoto();

        }


        private void BindPhoto()
        {
            DataSet ds = new DataSet();
            Pipeline databaseConnect = new Pipeline();
            try
            {
                using (SqlCommand selectPhoto = new SqlCommand("SELECT * FROM t_Post WHERE Id='" + SelectedPost.Id + "'", databaseConnect.connectDB()))
                {
                    using (SqlDataReader reader = selectPhoto.ExecuteReader())
                    {
                        postPhotos = new List<Post>();
                        while (reader.Read())
                        {
                            string image2 = Convert.ToBase64String((byte[])reader["Photo_2"]);

                            var otherPhoto = new Post
                            {
                                PhotoSource2 = image2
                            };
                            postPhotos.Add(otherPhoto);
                        }
                    }
                }
            }
            catch(Exception ex)
            {

            }

        }
     }
}

PS: what happens is that if Im gonna use parameter Photo everything goes well but if I use Photo_2 and Photo2 my program breaks and says
System.InvalidCastException: Specified cast is not valid

Tagged:

Answers

  • DirkWilhelmDirkWilhelm USMember ✭✭✭✭

    On what line do you get that exception?

    Also there are some typos in your code?

    You are binding to Photo_2 in your xaml, but your PostModel does not have such a property. I guess you want to bind to Photo2?

    In the getter of Photo2 you are using
    byte[] bytes = Convert.FromBase64String(PhotoSource)

    Shouldn't that be
    byte[] bytes = Convert.FromBase64String(PhotoSource2)

  • ma12rkyma12rky Member ✭✭✭
    @DirkWilhelm to simplify my story the exception will fire if I go to this page because my first page has view more photo and upon tapping on view more it will go to this page
  • ma12rkyma12rky Member ✭✭✭
    @DirkWilhelm Photo_2 is my column in database and in that table I have columns Photo, Photo_2, Photo_3
  • ma12rkyma12rky Member ✭✭✭
    @DirkWilhelm what is the difference between the two

    In the getter of Photo2 you are using
    byte[] bytes = Convert.FromBase64String(PhotoSource)

    Shouldn't that be
    byte[] bytes = Convert.FromBase64String(

    I dont see any difference aside from in complete parentheses
  • DirkWilhelmDirkWilhelm USMember ✭✭✭✭

    @ma12rky said:
    @DirkWilhelm Photo_2 is my column in database and in that table I have columns Photo, Photo_2, Photo_3

    For your bindings in the xaml it doesn't matter what your column names in your database are. You are binding to a property of your view model, not to a column of your database.

    @ma12rky said:
    @DirkWilhelm what is the difference between the two

    In the getter of Photo2 you are using
    byte[] bytes = Convert.FromBase64String(PhotoSource)

    Shouldn't that be
    byte[] bytes = Convert.FromBase64String(PhotoSource2)

    I dont see any difference aside from in complete parentheses

    In your code in BindPhoto() you are setting the value of PhotoSource2:

     var otherPhoto = new Post
     {
          PhotoSource2 = image2
      };
    

    But in your viewmodel you are not using PhotoSource2 but PhotoSource:

    public ImageSource Photo2
    {
          get
          {
                    byte[] bytes = Convert.FromBase64String(PhotoSource);  <---- Here 
                    MemoryStream ms = new MemoryStream(bytes);
                    ImageSource s = ImageSource.FromStream(() => ms);
                    return s;
           }
           set
           {
    
           }
      }
    
  • LeonLuLeonLu Member, Xamarin Team Xamurai

    Does your ImageSource Photo and ImageSource Photo2 use the same Convert.FromBase64String(PhotoSource);? maybe ImageSource Photo2 should use Convert.FromBase64String(PhotoSource2);?

    And this line in xaml <Image Source="{Binding Photo_2}" HeightRequest="70" WidthRequest="70" Margin="0,0,5,0" /> binding Photo_2, but you moduel Post did not contains this property, it seems to change from Photo_2 to Photo2

  • ma12rkyma12rky Member ✭✭✭
    @LeonLu upon using your suggestion it throws another error when going to this page
    System.Reflection.TargetInvocationException: Exception has been thrown by the target of an invocation.
  • LeonLuLeonLu Member, Xamarin Team Xamurai

    Can you share a demo for this layout(please do not share a project, due to the policy, we cannot receice it), you can use static data in this demo.

Sign In or Register to comment.