I use telerik web ui  2024.1.131.45 in my asp net web app. Using Rad Image Gallery the thumbnail is not showing (see attached). Any idea why?

Thanks before

Hi everyone,

Hi everyone, I'm using Telerik UI, and when I'm on a mobile view with the content editor, and then I select the image gallery, it doesn't seem to be responsive, or its just too wide for the phone screen.  Is there some way to force that image manager to be the correct size? Or is that even possible?  

We have the RadImageGallery implemented on page. The code behind loads up one or more images by reading in an array of bytes from each file.  Occasionally, an exception is thrown when one of those images is invalid (corrupt or some other issue).  OK, that's fine, but we would like to trap the exception and handle the error in a particular way.  But... we don't seem to be able to trap it other than in our last-chance global exception handler.

The binary data is created in the NeedDataSource event, and that returns successfully.  I've added other events and set breakpoints in each of them, and they all return ok.  So, is there an event we can handle that would be appropriate for a simple try/catch block?

Pretty simple markup for the RadImageGallery control (note, all the events after the OnNeedDataSource were added simply to test out if there was a place we could try/catch the exception, but no exception was thrown in those events):

    <telerik:RadImageGallery ID="galleryImages" runat="server" RenderMode="Lightweight"
        DisplayAreaMode="Image" LoopItems="true" DataImageField="ImageBytes" DataDescriptionField="Description" DataTitleField="Title"
        OnNeedDataSource="galleryImages_NeedDataSource"
        OnDataBinding="galleryImages_DataBinding"
        OnImageRequested="galleryImages_ImageRequested" 
        OnItemCreated="galleryImages_ItemCreated" 
        OnPreRender="galleryImages_PreRender">
    </telerik:RadImageGallery>

Code behind for NeedDataSource (which returns successfully):

    protected void galleryImages_NeedDataSource(object sender, Telerik.Web.UI.ImageGalleryNeedDataSourceEventArgs e)
    {
        galleryImages.Visible = false;

        FileManager fileManager = new FileManager ();
        DataTable dt = fileManager.GetFileList();
        var imageFiles = fileManager.GetGalleryImages(dt);

        if (imageFiles.Count() == 0)
        {
            txtNotes.Text = "There are no image files to display.";
            return;
        }

        try
        {
            galleryImages.DataSource = imageFiles;
            galleryImages.Visible = true;
        }
        catch (Exception ex)
        {
            LogException(ex);
            ErrorMessage("An unexpected occurred while reading one or more the image files");
        }

        if (fileManager.HasErrors)
        {
            txtErrors.Text = "The following errors were encountered:<br/><ul>" + String.Join("<li>", fileManager.ErrorList) + "</ul>";
        }
    }

Library code that reads image files into byte arrays (also return successfully):

        public List<GalleryImage> GetGalleryImages(DataTable srcDataTable)
        {

            //...


            foreach (DataRow dr in query)
            {
                CustomImageFile f = new CustomImageFile(dr);                

                try
                {
                    byte[] byteArray = File.ReadAllBytes(f.FullFileName);
                    GalleryImage img = new GalleryImage
                    {
                        ImageBytes = byteArray,
                        Description = $"{f.Description}", // [{f.Name}]
                    };
                    imageList.Add(img);
                }
                catch (Exception ex)
                {
                    Errors.Add($"{f.Name} could not be read");
                    LogException(ex);                    
                }
            }
            return imageList;
        }

Yet when there is an invalid file encountered, we get this:

[ArgumentException: Parameter is not valid.]
   System.Drawing.Image.FromStream(Stream stream, Boolean useEmbeddedColorManagement, Boolean validateImageData) +1162080
   Telerik.Web.UI.BinaryImageFormatHelper.CreateImgFromBytes(Byte[] data) +69

[ArgumentException: The provided binary data may not be valid image or may contains unknown header]
   Telerik.Web.UI.BinaryImageFormatHelper.CreateImgFromBytes(Byte[] data) +120
   Telerik.Web.UI.BinaryImageTransformationFilter.ProcessImageInternal(Byte[] image) +44
   Telerik.Web.UI.BinaryImageTransformationFilter.ProcessImage(Byte[] image) +20
   Telerik.Web.UI.BinaryImageFilterProcessor.ProcessFilters(Byte[] imageData) +112
   Telerik.Web.UI.RadBinaryImage.ProcessImageData() +57
   Telerik.Web.UI.RadBinaryImage.OnPreRender(EventArgs e) +20
   System.Web.UI.Control.PreRenderRecursiveInternal() +90
   System.Web.UI.Control.PreRenderRecursiveInternal() +163

actually there is a method get_itemIndex(), which would be equivalent to a method set_selectedIndex(index) from RadMultipage or one method like select()
from RadComboBox

How could I implement it or a code javascript would help me a lot

thanks

Can someone help - I can't find anything in the docs, but it shoud be easy...

I have an image gallery working with sqldatasource and all looks good except the readability of the title text which appears over the image.

The customers for this website are 'senior citizens'  and can't read the captions. (see bessacarr-owners-club.org/photo-gallery.aspx)

My problem is that the text is a shade of grey and the surrounding box is also a (lighter) shade of grey. How can I make the text more contrasting.

eg the background darker and the text lighter?

Thanks

Clive

Q2 2016 controls in use

I am converting an old application that stores its images as base64strings in a SQL Server database.

I am trying to add the images to the gallery. Pointing the ImageURL to a base64 string works fine, but not the ThumbnailURL.

        public static string ImageToBase64(System.Drawing.Image image, System.Drawing.Imaging.ImageFormat format)

        {
            string returnString = "";
            System.IO.MemoryStream ms = new MemoryStream();

            image.Save(ms, format);
            byte[] imageBytes = ms.ToArray();
            returnString = "data:image;base64," + Convert.ToBase64String(imageBytes);

            return returnString;
        }

        public static Telerik.Web.UI.ImageGalleryItem ImageBase64(byte[] BlobData, string ImageTitle)
        {
            Telerik.Web.UI.ImageGalleryItem returnImage = new Telerik.Web.UI.ImageGalleryItem();

            System.Drawing.Image img = null;
            System.IO.MemoryStream mem = new MemoryStream();
            mem.Write(BlobData, 0, BlobData.Length);
            mem.Seek(0, SeekOrigin.Begin);

            img = System.Drawing.Image.FromStream(mem);

            returnImage.Title = ImageTitle;
            returnImage.ThumbnailUrl = ImageToBase64(SizedImage(img, 100, 75), System.Drawing.Imaging.ImageFormat.Jpeg);
            returnImage.ImageUrl =     ImageToBase64(SizedImage(img, 800, 600), System.Drawing.Imaging.ImageFormat.Jpeg);
            return returnImage;
        }

        returnImage.ImageUrl works perfectly fine.

        public static System.Drawing.Bitmap SizedImage(System.Drawing.Image img, int dispWidth, int dispHeight)
        {
            double scale = 1.0, hScale = 1.0;
            double imgWidth = img.Width;
            double imgHeight = img.Height;

            if (imgWidth > dispWidth)
                scale = dispWidth / imgWidth;
            if (imgHeight > dispHeight)
                hScale = dispHeight / imgHeight;
            if (hScale < scale)
                scale = hScale;

            int imgw = Convert.ToInt32(imgWidth * scale);
            int imgh = Convert.ToInt32(imgHeight * scale);

            return new System.Drawing.Bitmap(img, imgw, imgh);
        }