Qml Item grabToImage save image error - image

I'm using the
Item.grabToImage()
But I'm getting the following error.
QML ItemX: grabToImage: item has invalid dimensions
This is because I'm using height and width properties like so:
width: {
// return with * 0.4; based for some condition
// for eg
return parent.width * 0.4;
}
// and something similar with height
The only time that I can get the following code working is when I put in a static heigth and width:
grabToImage(
function(result)
{
result.saveToFile("/path/project-name/tmp/something.png");
}
);
Any ideas of why and how do I get around this problem?
Thank you

I'm not a 100% sure why, But it was something about the dynamic width of the parent.
In the program I wrote I has set the anchors of the image to the left and right of the preview container.
So when I tried to get the image capture from another item that was overlaying the image to cut out smaller parts of the image it was not letting me.
How I fixed this was to set a fixed image size of the source image and then just anchor it to the center of the preview section.
The only thing is now it will not size up if you scale the window.
I'm sure I could implement and on size change to the main program window and then set the width of the image (Not tested).
Last thing I should mention is that if the image is small then the cut out images from sections of the source image will be blurry and not good quality.
I fixed this by setting the "sourceSize.width" to a very large image and then used the "scale" property to scale down the image to fit within the preview item.

Related

Image in anychart doesn't fix the stage

I'm trying to put some logos in a chart for print them, but depending of the screen resolution logo at the right sometimes is out of the chart area and sometimes is far of the edge. I'm using stage and putting the logo with graphics.image. This is the code anychart v 8.2.1
var image = anychart.graphics.image("logo_mues2020.png", "12%", "9%",102, 43);
image.parent(container);
image = anychart.graphics.image("gepp2020.jpg", "72%", "9%", 155, 47);
image.parent(container);
container is a stage
And these are the examples in two different devices
https://imagizer.imageshack.com/img924/5741/tmDgQA.png
https://imagizer.imageshack.com/img923/7563/QuQJcI.png
does somebody has made something similar?
is there a way to fix it with the chart area or make it fit more better and really responsive?
Thanks in advance
It happens because the image size is applied in pixels, not percents. it means that the image is not resized along with the container and when the container has a small width the image goes beyond the chart.
To solve that you should use percents for the image size and apply the align setting. For details, check the sample and pay attention to lines 17 and 19.
Try to resize the chart view to see how it works.

vb6: place image control on frame dynamically

I'm working on a new UI-element in an vb6 programm. I need to place pictures dynamically on 2 diffenent colored background lines:
I tried out two different ideas but none of them is working:
Idea 1
I used image control and assigned an image to the control. Then I set left, top, with and hight properties to values where I want to place the image. Image was places at correct position but not in foregound on a frame but in background (behind coloured frame).
Can anyone tell me how I can place an image control in foreground (on green coloured frame)? I need to place these image controlls dynamically from code in running program.
Idea 2
In second sulution I tried to use picturebox instead of image control. Picturebox can be placed on colored background (frame) without any problems.
Here the problem is that loaded picture has to be scaled to size of picturebox picture property. Picture is loaded to picturebox by following code: Picture.Picture = LoadPicture("F:\img.JPG")
Does anyone know how I can scale this img to size of picturebox?
Can anyone help me to follow up one of the solutions. In principle I would prefere to use Image controls if it is polible to place them in foreground on frame.
I'm going to guess that after creating the image control, you are moving it onto the Frame. If so, this is why the control is behind the Frame. You really want the image to be inside the frame. The key to do this is to set the Container property.
Dim img As Image
Set img = Me.Controls.Add("VB.Image", "Image1")
If Not img Is Nothing Then
img.Move 200, 200, 400, 400
img.Stretch = True
img.Picture = LoadPicture("your image.jpg")
Set img.Container = Frame1
img.Visible = True
End If

GWT - Getting the current size of an image

I use the GWT image class with a ClickHandler to trigger actions when specific areas of the image are clicked. In order to specify these areas, I use the image's dimensions. The problem occurs when you change the size of your browser window. While the image rescales nicely, the getWidth() and getHeight() methods still return the image's original size, not the size after rescaling.
Do you know a way to retrieve the current size of the image?
.getElement().getOffsetWidgth() ? and .getOffsetHeight().
I think thats what you need.
That will return the current size of the element in the Dom, including any decorations like borders in the CSS.

Responsive Portfolio Gallery Image Resizing

I am making a responsive portfolio website using WordPress. I have a small issue that is breaking the layout. All images are meant to be 300px wide by 200px high.
I have also used the WordPress API to crop images if the user uploads images that are larger than the above mentioned dimensions
add_image_size( "portfolio", 300, 200, true );
What this does for me is that it inserts the width="300" and height="200" attributes to the images automatically (but the original dimensions of the image stay the same they are just being resized) This works well except when i try to resize my browser window..
Here is a senario: The client uploads an image with dimensions 300px wide and 210px high.. initially it is being resized and shown hence the layout is perfect but when i resize the browser the images gets resized as well but with respect to its "original dimensions".. hence the image with the original height of 210px is larger that the rest of the images.. and as i am floating all the images to form a 3 column layout the difference in height breaks the layout (shifting the column below this large image to the right and leaving an empty column below itself.)
How do i fix this issue? I thought of using timthumb to resize all images before they are display.. hence changing the original dimensions of the image on the fly but i think this is not an efficient way? Any other solution to this problem ? Also i dont want to using anything like jQuery Masonry as i have a specific layout to maintain.
Thanks
You can use the max-height rule from css to limit the height of all images equally.
eg:
.gallery img{
max-height: (some height);
}
Use % or em for the height, pixels might not work as well in a responsive design.

Large Image Centering

I get from the server image 800X800 in jpg format and i need to display it in center of the WP7 screen. I need to display like example in this url
http://imageshack.us/photo/my-images/152/examplea.jpg/
I prefer to do this without cropping of image if it possible, because i get new image always in start of application. I tried with stretch, rectangle geometry.
I write this without code example, because this is only insert a image.
Sorry for my bad English.
Try like this in Xaml
Image name="Image" width = 800 height = 1000 stretch = fill Margin="-215,-120,-255,-184"
Then set the source

Resources