This is a migrated thread and some comments may be shown as answers.

How to show Horizontal List of Image

7 Answers 628 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Dario Concilio
Top achievements
Rank 2
Dario Concilio asked on 25 Jul 2016, 07:45 AM

Hi,

I would print a list of image, these images are certified mark and I have to show theme in horizontal orientation.

But these pictures could be seen all, or only some. But those that remain visible must all be near and no spaces.
I tried to use the crosstable, but it seems that is not working.
How can I do?

7 Answers, 1 is accepted

Sort by
0
Stef
Telerik team
answered on 25 Jul 2016, 01:12 PM
Hello Potito,

Please test adding a List item. Then select the item and its 'Rotate Layout' option from the Context menu - this will cause the item to grow horizontally.

You can place a PictureBox item in the cell of the List item, and then bind the List.DataSource property to a list of paths to images. The PictureBox.Value property can be set via expression to the field representing the image path.

Regards,
Stef
Telerik by Progress
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
0
Dario Concilio
Top achievements
Rank 2
answered on 25 Jul 2016, 01:29 PM

I already tried this approach, but surpassing the amount of 4 images in sequence, were not even printed.
I found a way code solution through the collection of images, I create a bitmap and compose through the Graphics object, by managing the proportion of individual bitmap.

 

01.Public ReadOnly Property SequenceImages As Image
02.    Get
03. 
04.        Dim _Items = MySharedMethods.GetImages
05. 
06.        'Create a dictionary with the index of each image and the correct size of each setting constant as the height, maintaining the proportion
07.        Dim _ItemsDictionary = New Dictionary(Of Integer, Size)
08. 
09.        Dim _CompleteWith As Integer = 0
10.        Dim _CompleteHeight As Integer = m_DimensioneMarchi
11. 
12.        Dim _Height = m_DimensioneMarchi
13. 
14.        For _Index = 0 To _Items.Count - 1
15. 
16.            Dim _Image = _Items(_Index).Marchio
17. 
18.            Dim _Width = CInt((_Image.Width * m_DimensioneMarchi) / _Image.Height)
19. 
20.            _ItemsDictionary.Add(_Index, New Size(_Width, _Height))
21. 
22.            'Trace the length of the final bitmap
23.            _CompleteWith += (_Width + m_MargineMarchi)
24. 
25.        Next
26. 
27.        'I compose the final bitmap based on the information of the previously constructed Dictionary
28.        Dim _Bitmap As New Bitmap(_CompleteWith, _CompleteHeight)
29. 
30.        Dim _Graphics = Graphics.FromImage(_Bitmap)
31. 
32.        With _Graphics
33. 
34.            .CompositingMode = Drawing2D.CompositingMode.SourceCopy
35.            .CompositingQuality = Drawing2D.CompositingQuality.HighQuality
36. 
37.            .Clear(Color.White)
38. 
39.            Dim _X As Integer = 0
40. 
41.            For Each _Item In _ItemsDictionary
42. 
43.                Dim _Size = _Item.Value
44. 
45.                .DrawImage(_Items(_Item.Key).Marchio, _X, 0, _Size.Width, _Size.Height)
46. 
47.                'It moves the horizontal position for the next mark
48.                _X += (_Size.Width + m_MargineMarchi)
49. 
50.            Next
51. 
52.            .Dispose()
53. 
54.        End With
55. 
56.        Return _Bitmap
57. 
58.    End Get
59. 
60.End Property

0
Dario Concilio
Top achievements
Rank 2
answered on 25 Jul 2016, 01:34 PM

Excuse me, I left a few variables in Italian, below the translations:

m_DimensioneMarchi = Height constant of all images

m_MargineMarchi = Margin width that needs between images

_Items(_Index).Marchio = MySharedMethods.GetImages returns a List(Of MyObject), this one has 2 property: Index as Integer and , Marchio as Image

0
Dario Concilio
Top achievements
Rank 2
answered on 25 Jul 2016, 01:39 PM
My example in action, there are simply 2 PictureBox of report.
0
Stef
Telerik team
answered on 28 Jul 2016, 08:40 AM
Hi Potito,

We are glad to hear you found a solution.

In case you still want to test the suggested approach, please check the attached TRDP file in the Standalone Report Designer of Telerik Reporting R2 2016 or later. There is also a video - SWF file, that can be previewed in IE browser.

Regards,
Stef
Telerik by Progress
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
1
Vas
Top achievements
Rank 1
Veteran
answered on 03 Sep 2020, 01:13 PM

Hi Stef, 

If there are more images in the list, instead of displaying them on another page, is there an option to display 4 images horizontally and 4 images below and 2 images below.

Could you please help us with this?

 

Thanks

Vasanth

 

1
Silviya
Telerik team
answered on 08 Sep 2020, 11:09 AM

Hello Vasanth,

Please check this article for more information and a demo: 

https://www.telerik.com/support/kb/reporting/details/how-to-create-multi-column-report---across-the-page-and-then-down

Best Regards,
Silviya
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Tags
General Discussions
Asked by
Dario Concilio
Top achievements
Rank 2
Answers by
Stef
Telerik team
Dario Concilio
Top achievements
Rank 2
Vas
Top achievements
Rank 1
Veteran
Silviya
Telerik team
Share this question
or