Share this blog!

Facebook has so many cool animated stickers but there is (-still-) no easy way of using them as gif. Here is a method to download Facebook stickers as gif.

1. Select the sticker you want and right click. Select Inspect element from the dropdown menu.



2. The html code of the current page will be displayed. You can hover over the sticker and the relevant code will be highlighted. But I’m not 100% sure if all the browsers support the hover-and-highlight thing.

You will see a URL to an image file in the html code – that’s our image!


3. Copy and paste the URL in a new tab and you will be directed to an image with a collection of images that adds up to the complete gif. Save the image in your device.


4. Next step is all about getting separate small images from the collection and if you’re a Windows user, you can simply use Microsoft Office Picture Manager to crop the image.

If your image is transparent, make sure to get rid of transparency before copying. You can simply open it in Paint and click CTRL+S and swoosh! Your transparency will be gone.

Copy the original file to a number of separate images and crop each as shown below.

All your separate images should have the same size and a correct positioning in order to create a neat animation – which is facilitated by this method.


5. By now you will have a series of still images. If you are not familiar with Photoshop or similar application, you can always look forward to online apps. There are so many online tools that support the conversion of images to gif.

If you know a bit about Photoshop, all you have to do is to load the images in separate layers. Then click on “Windows” menu and select “Animation”. A toolbox will appear and you can get an idea about the order by going through the frames displayed. You can control the looping from an option in the toolbox which you can use to change the repetition of the animation (-whether once or forever-).


Once you are done, save your gif using “Save for web, devices” option.




The default jPanel allows users to add a background color by calling
 .setBackground(Color colorname); 
but there is no way to set a background image so easily. The only option is to call in a separate class with modifications. You can simply use the following code to add a background image to a jPanel.
import java.awt.Dimension;
import java.awt.Graphics;
import java.awt.Image;
import javax.swing.ImageIcon;
import javax.swing.JPanel;

/**
 *
 * @author Sachi
 */
class ImagePanel extends JPanel {

  private Image img;
  public ImagePanel(String img) {
    this(new ImageIcon(img).getImage());
  }
  public ImagePanel(Image img) {
    this.img = img;
    Dimension size = new Dimension(img.getWidth(null), img.getHeight(null));
    setPreferredSize(size);
    setMinimumSize(size);
    setMaximumSize(size);
    setSize(size);
    setLayout(null);
  }
  @Override
  public void paintComponent(Graphics g) {
    g.drawImage(img, 0, 0, null);
  }
}
You can use the above class as follows:-
ImagePanel panel = new ImagePanel(new ImageIcon(getClass()
                                     .getResource("/Resources/background.png"))
                                     .getImage());

Next PostNewer Posts Previous PostOlder Posts Home