javafxports image pixelated when zoomed in imageview - java

This is my code:
Image image1 = new Image(url);
Dialog mainDialog = new Dialog(true);
ImageView imageView = new ImageView();
imageView.setImage(image1);
imageView.setPreserveRatio(true);
imageView.setCache(true);
imageView.setSmooth(true);
imageView.setPickOnBounds(true);
imageView.setOnZoom(evt->{
imageView.setScaleX(imageView.getScaleX()*evt.getZoomFactor());
imageView.setScaleY(imageView.getScaleY()*evt.getZoomFactor());
});
mainDialog.setContent(imageView);
Platform.runLater(() -> mainDialog.showAndWait());

You don't provide much information about the image quality, and what do you mean by pixelated, at what scale it happens, or if it is only on mobile and not on desktop.
Anyway, here are a few hints to improve the results.
Add a hint to the cache, in this case CacheHint.SCALE.
Add clipping to the imageView. If the scale is too big, the image will be big on memory. This will prevent a possible memory issue. Bind the size of the rectangle to the view dimensions.
This works fine for me, even with scale factors of 20+:
Image image1 = new Image(url);
Dialog mainDialog = new Dialog(true);
ImageView imageView = new ImageView();
imageView.setImage(image1);
imageView.setPreserveRatio(true);
imageView.setCache(true);
imageView.setCacheHint(CacheHint.SCALE); // <-- hint
imageView.setSmooth(true);
imageView.setPickOnBounds(true);
imageView.setOnZoom(evt -> {
imageView.setScaleX(imageView.getScaleX() * evt.getZoomFactor());
imageView.setScaleY(imageView.getScaleY() * evt.getZoomFactor());
});
Rectangle r = new Rectangle();
imageView.setClip(r); // <-- clip
r.widthProperty().bind(view.widthProperty());
r.heightProperty().bind(view.heightProperty());
mainDialog.setContent(imageView);
mainDialog.showAndWait(); // <-- No need of runLater

Related

How do I resize an image in a label that's selected in a classpath resource?

This is the code
btnVoltar.setIcon(new ImageIcon(AdicionarRefeiĆ§Ć£o1.class.getResource("/icons/Back Icon.png")));
I want to resize it so it fits on a label, but its way too big.
You can try this codes here, but then again this post is a duplicate from stackoverflow
private ImageIcon image; // where in your case it's your class resource
Image IMG = image.getImage(); // transform it
Image newimg = IMG.getScaledInstance(200, 200, java.awt.Image.SCALE_SMOOTH); // scale it the smooth way
//Change the 200,200 to the number you prefer to resize it to
image = new ImageIcon(newimg); // transform it back

JavaFx: How to install a Tooltip on ImageView

I tried this:
public void addTargetCard(MissionCard mCard) {
int card = mCard.GetID();
leftSide.getChildren().removeAll(targetCardBox);
Image image = new Image(
MainApp.class.getResourceAsStream("images/target" + card
+ ".png"));
ImageView imageView = new ImageView();
imageView.setImage(image);
imageView.setFitHeight(81);
imageView.setFitWidth(108);
imageView.setPreserveRatio(true);
imageView.setPickOnBounds(true);
Tooltip.install(imageView, new Tooltip(intToCity(mCard.getStart())
+ " - " + intToCity(mCard.getFinish())));
targetCardBox.getChildren().add(imageView);
leftSide.getChildren().add(targetCardBox);
}
Can somebody explain me why my Tooltip doesn't work - i got no idea what i did wrong. (It's my first time that i use Tooltips's)
somebody else told me that ImageView doesnt work with tooltips and gave me this workaround - but i have again no tooltip when i move with my mouse over the label
public void addTargetCard(MissionCard mCard) {
int card = mCard.GetID();
leftSide.getChildren().removeAll(targetCardBox);
Image image = new Image(
MainApp.class.getResourceAsStream("images/target" + card
+ ".png"));
ImageView imageView = new ImageView();
imageView.setImage(image);
imageView.setFitHeight(81);
imageView.setFitWidth(108);
imageView.setPreserveRatio(true);
imageView.setPickOnBounds(true);
Label label = new Label();
label.setContentDisplay(ContentDisplay.GRAPHIC_ONLY);
label.setGraphic(imageView);
label.setTooltip(new Tooltip(intToCity(mCard.getStart()) + " - "
+ intToCity(mCard.getFinish())));
targetCardBox.getChildren().add(label);
leftSide.getChildren().add(targetCardBox);
}
Installing a tooltip to image view is working. Try yourself with new sample JavaFX project and see it. When you doubt about some functionality of the used API (JavaFX in this case) try to isolate the doubted use case into new fresh environment/project and observe it closely.
P.S. Why are you removing the targetCardBox from leftSide and adding it again afterwards.

Blend Mode doesn't work for ImageView

I have two image that is
and this:
I need to place that image (stacked) in a single ImageView. I tried to use blend mode, but doesn't work for ImageView like
Group group = new Group();
group.setBlendMode(BlendMode.SRC_OVER);
// tempImage is array of buffered Images
for(int i=0; i < tempImage.length ;i++){
if(tempImage[i] != null){
ImageView view = new ImageView();
Image im = SwingFXUtils.toFXImage(tempImage[i],
null );
view.setImage(im);
group.getChildren().add(view);
}
}
Just a little trick, instead of using BlendModeuse a HBox, add the images inside the HBox and set the HBox inside the Group
Group group = new Group();
HBox box = new HBox
// tempImage is array of buffered Images
for(int i=0; i < tempImage.length ;i++){
if(tempImage[i] != null){
ImageView view = new ImageView();
Image im = SwingFXUtils.toFXImage(tempImage[i],
null );
view.setImage(im);
box.getChildren().add(view);
}
}
group.getChildren.add(box);
But this wont help you to get the new image, guess you don't even need it !

Save SWT Image to File with Transparency Mask

This is my code thus far
ImageLoader saver = new ImageLoader();
saver.data = new ImageData[]
{ toSave.getImageData() };
saver.save(fileName, SWT.IMAGE_PNG);
toSave is an image that was loaded using the SWTResourceManager that is transparent in the program. fileName is a string representing the file I want to save the image to (ends with .png)
The result is an image with a black background instead of a transparent background that I want. How do I make the background transparent? I think it has something to do with the transparency mask, but I could be wrong.
Thanks in advance!
SWTResourceManager seems to be causing your problem. I would not recommend to use it.
Try this code, it works for me:
Display d = Display.getDefault();
Image image = new Image(d, "/pictures/Llama.gif");
ImageLoader saver = new ImageLoader();
saver.data = new ImageData[] { image.getImageData() };
saver.save("output.png", SWT.IMAGE_PNG);
image.dispose();
Remember to dispose the Image when you don't need it anymore.

Set size of Layered Drawable?

I am making a icon for my app.. The app is basically a friend finder. I am creating a overlay that looks much like the icons from Google Latitude. I have an image that changes due to the user and I have the boarder. I've been able to do the layered drawable and overlay fine, but the problem is, the image stretches to the size of the border. This is a problem because, if you've never seen the Google Lat icons, it has a point on the bottom with open space between it.
What I need to do is, somehow restrict the size of the changing image to the bounds of the square portion of the border. Any Help would be much appreciated. Here is my snippet:
BitmapFactory.Options options = new BitmapFactory.Options();
options.inSampleSize = 25;
Bitmap bit = BitmapFactory.decodeFile(photo, options);
draw = new BitmapDrawable(bit);
Resources r = getResources();
Drawable[] layers = new Drawable[2];
layers[0] = draw;
layers[1] = r.getDrawable(R.drawable.border);
LayerDrawable layerDrawable = new LayerDrawable(layers);
draw = layerDrawable;
}else{
draw = this.getResources().getDrawable(R.drawable.androidmarker);
}
HelloItemizedOverlay itemizedoverlay = new HelloItemizedOverlay(draw, this);
GeoPoint point = new GeoPoint(lat,lon);
OverlayItem overlayitem = new OverlayItem(point, username, avail + " : " + status + " : Position updated at : " + update_at);
items.add(overlayitem);
itemizedoverlay.addOverlay(overlayitem);
mapOverlays.add(itemizedoverlay);
Funny that shorty after I posted this, I found the answer. I was looking in all of the wrong places to resize the image. I tried the bitmap, the drawable, the layers inside of the layerdrawable. But, what I never tried was the layerdrawable itself. The solution is below:
Resources r = getResources();
Drawable[] layers = new Drawable[2];
layers[0] = draw;
layers[1] = r.getDrawable(R.drawable.border);
LayerDrawable layerDrawable = new LayerDrawable(layers);
layerDrawable.setLayerInset(0, 0, 0, 0, 12);
draw = layerDrawable;
The layerDrawable inset method is as follows:
layerDrawable.setLayerInset(*index of layer*, *left inset*, *top*, *right*, *bottom*);
Thanks guys!

Categories

Resources