Vaadin Image in a Grid not showing - image

I'm trying to display a tiny little image (16x16 pixels) in a TreeGrid Column.
treeGrid.addComponentColumn(i -> new Image("file://c:/temp/reddot.png", "alt")).setHeader("Preview");
In my IDE, this file url is underlined, I can click it, it opens the image in my browser. So, the file seems ok and exists.
But somehow, it does not appear in the grid column and the "alt" text doesn't appear either.
Hm. Anyone any idea what's going wrong ? Unfortunatly I don't see any error messages...
thanks,
Thorsten
PS: I'm using Version 13.

You could try to put image under META-INF/resources. Then you could reference image directly by name like this : Image im=new Image("kissa.jpg","Random picture");
Otherwise, you could create a inside and then reference mentioning also folder. In the picture below I have this set-up
And this is the output :
The whole code:
TreeGrid<Person> grid = new TreeGrid<>(Person.class);
grid.setHierarchyColumn("name");
grid.addComponentColumn(e->{
if(e.getName().equals("daughter")) {
Image im=new Image("test/cat.jpg","Random picture");
im.setWidth("200px");
im.setHeight("150px");
return im;}
else {
Image im=new Image("kissa.jpg","Random picture");
im.setWidth("200px");
im.setHeight("150px");
return im;}}).setHeader("Cat");
Person dad = new Person("dad", null);
Person son = new Person("son", dad);
Person daughter = new Person("daughter", dad);
List<Person> all = Arrays.asList(dad, son, daughter);
all.forEach(p -> grid.getTreeData().addItem(p.getParent(), p));
add(grid);
The example of TreeGrid is copied from here: Using new features with the LTS version: case TreeGrid

Related

add an image to given coordinates on a PDF page

How can I add an image to given coordinates (x,y) on a PDF page, using IronPdf?
Using the samples, I managed easily to add a "stamp", but that is placed in the center of the page.
I would need to be able to pass (x,y) as parameters when adding the image to each page, and I find this info nowhere in the class documentation.
var stamper = new IronPdf.Editing.ImageStamper(Image);
pdf.ApplyStamp(stamper, pageNumber);
See code above that adds the image in the page center.
You can set HorizontalOffset and VerticalOffset by IronPdf.Editing.Length .
I wrote sample code as below, hope it helps:
var pdf = new PdfDocument("./test.pdf");
ImageStamper logoImageStamper = new ImageStamper("[YOUR IMAGE PATH]/cat.jpg");
logoImageStamper.HorizontalOffset = new Length(300, MeasurementUnit.Pixel);
logoImageStamper.VerticalOffset = new Length(-500, MeasurementUnit.Pixel);
pdf.ApplyStamp(logoImageStamper);
pdf.SaveAs("test_new.pdf");
Code running effect:

Save multiple images with one function - AS3 ADOBE AIR

I've got an Array with 17 web links of images
var products:Array;
trace(products)
// Ouput :
"http://www.myWebsite.com/zootopia.jpg"
"http://www.myWebsite.com/james.jpg"
"http://www.myWebsite.com/tom.jpg"
..etc
If I do products[10].movieimage; the output will be the 9th link (something like : "http://www.myWebsite.com/lalaland.jpg")
I'm looking for downloading every images without a dialog box.
I manage to do so for 1 image with the specific link, like that :
function saveImage (event:Event):void {
var stream:URLStream = new URLStream();
var image1:File = File.documentsDirectory.resolvePath("test.jpg");
var fileStream:FileStream = new FileStream();
stream.load(new URLRequest("http://www.myWebsite.com/lalaland.jpg"));
stream.addEventListener(Event.COMPLETE, writeComplete);
        
function writeComplete(evt:Event):void  {
                var fileData:ByteArray = new ByteArray();
                stream.readBytes(fileData,0,stream.bytesAvailable);
                fileStream.openAsync(image1, FileMode.UPDATE);
                fileStream.writeBytes(fileData,0,fileData.length);
                fileStream.close();
trace("writeComplete");
trace(image1.url);
        }
}
Question : Is there a way to download all the images with the web links of my products array ? (and if images already exist, replace them. I could use if (image1.exists){ if (image2.exists){ ..etc for each image. But maybe there is a simplier solution)
If you could show me how, with a bit of code, I could that.
Also, note that I'd like to load the images then in Uiloader, like that :
function loadImages():void {
uiloader1.source = image1.url;
uiloader2.source = image2.url;
etc...
}
Don't over think it. You have your array of images. You have your tested routine for saving one image. Now put it together:
Some function initializes things and kicks it off.
Either splice out (or pop out) an item on the array – OR use a index var to access an item in the array
Pass that to your download function.
When the download completes either pop another item off the array OR increment your index. But first you would test if array.length== 0 OR `index > array.length. If either is true (depending on which method you use), then you are done.
If you want to get fancy you can show a progress bar and update it each time your download completes.

Add circle on Bokeh image

I'm working with Bokeh and I want to add a circle on a specific position on my image.
For the moment, I create my image like this :
img = image(image=[data],
x_range=[0, x_range],
y_range=[0, y_range],
x=x,
y=y,
dw=dw,
dh=dh,
tools=TOOLS,
palette=["Greys-9"],
title=title,
plot_width=plot_width,
plot_height=plot_height,
)
circle(x=10,y=10,radius=100,fill_color="#df1c1c",line_color="#df1c1c")
resources = Resources("inline")
plot_script, plot_div = components(img, resources)
html_script = encode_utf8(plot_script)
html_div = encode_utf8(plot_div)
hold()
figure()
return html_script, html_div
and send this to my HTML page.
The problem is that the circle is not on the final display. Maybe on background ? I don't know...
I tryed add function, add_glyph function, add_layout... None of these are functionnal!
Thanks for helping guys
The above code did not work due to a bug in Bokeh. However, the bug has since been fixed, and that code and code similar to it will function as expected.

ActionScript 2 loadClip depth

When I use:
loader = new MovieClipLoader();
_root.createEmptyMovieClip("level1",getNextHighestDepth());
_root.level1.createEmptyMovieClip("image",getNextHighestDepth());
loader.loadClip("http://someimage.jpg",_root.level1.image);
...it works and the image shows up.
But when I use:
loader = new MovieClipLoader();
_root.createEmptyMovieClip("level1",getNextHighestDepth());
_root.level1.createEmptyMovieClip("level2",getNextHighestDepth());
_root.level1.level2.createEmptyMovieClip("image",getNextHighestDepth());
loader.loadClip("http://someimage.jpg",_root.level1.level2.image);
...the image doesn't show up. Can anyone tell me why? How can I make this work?
the depth you are supplying is going to be '1'. is that what you are expecting?
each movie clip has it's own set of depths, so the nextHighestDepth() of the newly create 'image' mc, will be 1. it should not prevent loading the image though.
As gthmb says, you should call getNextHighestDepth() on the same MovieClip as you do the createEmptyMovieClip() on. So your code example should be more like:
loader = new MovieClipLoader();
_root.createEmptyMovieClip("level1",_root.getNextHighestDepth());
_root.level1.createEmptyMovieClip("level2",_root.level1.getNextHighestDepth());
_root.level1.level2.createEmptyMovieClip("image",_root.level1.level2.getNextHighestDepth());
loader.loadClip("http://someimage.jpg",_root.level1.level2.image);
Also, I would recommend storing references to the created MovieClips, so you won't have to use the full path in each occurrence in the code, something in the lines of this:
loader = new MovieClipLoader();
var level1:MovieClip = _root.createEmptyMovieClip("level1",_root.getNextHighestDepth());
var level2:MovieClip = level1.createEmptyMovieClip("level2",level1.getNextHighestDepth());
var image:MovieClip = level2.createEmptyMovieClip("image",level2.getNextHighestDepth());
loader.loadClip("http://someimage.jpg",image);

Image Misalignment in Visual Studio application

I have a Visual Studio application with a splash screen image cut into "slices". The positions are specified in the Form Designer so they line up properly on the screen. However, the images are out of place when the application is run on the Chinese version of Windows XP. It looks as if the image slices were "exploded" apart.
What's going on here? Do international versions of Windows have a different meaning of the "top left" coordinate of the picture? How can I force the images to be precisely displayed where I want them?
We found a solution! Apparently the picture boxes stretched out on the Chinese XP PC, but the images they contained did not. The fix was to add code like the following:
Me.PictureBoxIcon.Width = Me.PictureBoxIcon.Image.Width
Me.PictureBoxIcon.Height = Me.PictureBoxIcon.Image.Height
Dim loc As New Point
loc.X = Me.PictureBoxIcon.Location.X
loc.Y = Me.PictureBoxIcon.Location.Y + Me.PictureBoxIcon.Height
Me.PictureBoxAbout.Location = loc
Me.PictureBoxAbout.Width = Me.PictureBoxAbout.Image.Width
Me.PictureBoxAbout.Height = Me.PictureBoxAbout.Image.Height
Hope this helps someone else!
In the OnLoad event of the form, you could always explicitly set the location of each section. If starting at the top left with the first and assuming an array with the images in order:
images[0].Location = new Point(0,0);
for (int i = 1; i < images.Length; i++)
{
images[i].Location = new Point(images[i - 1].Location.X + images[i - 1].Width, 0);
}
That will set the first image to the top left corner and all subsequent images to just after the last image.

Resources