Monday, 3 August 2015

Programming the Designs(GUI) Part-3

Here is the code snippet that I have described in previous tutorial:
import java.awt.Color;
import java.awt.Container;
import java.awt.Font;
import java.awt.Image;
import java.io.File;
import java.io.IOException;

import javax.imageio.ImageIO;
import javax.swing.ImageIcon;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPasswordField;
import javax.swing.JTextField;

import java.awt.Rectangle;
import java.awt.event.MouseEvent;
import java.awt.event.MouseListener;

public class FirstGUI {
//declaration
    public static JFrame fr;
    public static JLabel back,login,loginl,text1,text2,rapid;
    public static JTextField user;
    public static JPasswordField pass;
    public static Font f;
    public static Container c;
    public static Image backI,eleI;
    public static ImageIcon backi,elei;
   
    public FirstGUI() throws Exception {

      
        fr=new JFrame();//Frame initialization
      
        //font for headings
        f=new Font("Arial Rounded MT Bold", Font.BOLD, 32);
        //container pane for adding controls
        c=fr.getContentPane();
        //setting layout null so we can add controls anywhere by setting bounds
        c.setLayout(null);
      
        //initialization of controls
        back=new JLabel();
        user=new JTextField("User name");
        pass=new JPasswordField("Password");
        login=new JLabel();
        loginl=new JLabel("Login",JLabel.CENTER);
        text1=new JLabel();
        text2=new JLabel();
        rapid = new JLabel();
      
      
      
        //setting bounds of the frame to the Dimension d initialized in class definition
        fr.setBounds(0,0, 500, 500);
        back.setBounds(0,0,fr.getWidth(),fr.getHeight());
        user.setBounds(172,  138, 180, 61);
        pass.setBounds(172,  210, 180, 65);
        loginl.setBounds(155, 286, 197, 65);
        login.setBounds(loginl.getBounds());
        rapid.setBounds(0, 38, 484, 71);
        //background image bounds
        text1.setBounds(user.getBounds());
        text2.setBounds(pass.getBounds());
      
        //making textField background transparent
        user.setOpaque(false);
        pass.setOpaque(false);
      
        //making textfield borders off
        user.setBorder(null);
        pass.setBorder(null);
      
      
      
        //background image
        backI = ImageIO.read(new File("/MyFirst/src/images/back1.jpg"));  
        backI = backI.getScaledInstance(fr.getWidth(), fr.getHeight(),Image.SCALE_REPLICATE);
        backi = new ImageIcon(backI);
        back.setIcon(backi);
      
        //login click
        eleI = ImageIO.read(new File("/MyFirst/src/images/login.png"));  
        eleI = eleI.getScaledInstance(login.getWidth(), login.getHeight(),Image.SCALE_REPLICATE);
        elei = new ImageIcon(eleI);
        login.setIcon(elei);
      
        backI = ImageIO.read(new File("/MyFirst/src/images/textbox.png"));  
        backI = backI.getScaledInstance(user.getWidth(), user.getHeight(),Image.SCALE_REPLICATE);
        backi = new ImageIcon(backI);
        text1.setIcon(backi);
        text2.setIcon(backi);
      
        backI = ImageIO.read(new File("/MyFirst/src/images/RapidAbcd.png"));  
        backI = backI.getScaledInstance(rapid.getWidth(), rapid.getHeight(),Image.SCALE_REPLICATE);
        backi = new ImageIcon(backI);
        rapid.setIcon(backi);
      
        user.setFont(new Font("Arial", Font.BOLD, 15));
        user.setForeground(Color.gray);
        pass.setFont(new Font("Arial", Font.BOLD, 15));
        pass.setForeground(Color.gray);
        loginl.setFont(new Font("Arial", Font.BOLD, 20));
        loginl.setForeground(Color.white);
      
        c.add(rapid);
        c.add(user);
        c.add(pass);
        c.add(text1);
        c.add(text2);
        c.add(loginl);
        c.add(login);
        c.add(back);
      
      
      
        fr.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        fr.setVisible(true);
      
login.addMouseListener(new MouseListener() {
   
    @Override
    public void mouseReleased(MouseEvent arg0) {
        try {
            eleI = ImageIO.read(new File("/MyFirst/src/images/loginhover.png"));
      
        eleI = eleI.getScaledInstance(login.getWidth(), login.getHeight(),Image.SCALE_REPLICATE);
        elei = new ImageIcon(eleI);
        login.setIcon(elei);
        } catch (IOException e) {
            // TODO Auto-generated catch block
          
        }  
    }
   
    @Override
    public void mousePressed(MouseEvent arg0) {
        try {
            eleI = ImageIO.read(new File("/MYFirst/src/images/loginclick.png"));
      
        eleI = eleI.getScaledInstance(login.getWidth(), login.getHeight(),Image.SCALE_REPLICATE);
        elei = new ImageIcon(eleI);
        login.setIcon(elei);
        } catch (IOException e) {
            // TODO Auto-generated catch block
          
        }          
    }
   
    @Override
    public void mouseExited(MouseEvent arg0) {
        try {
            eleI = ImageIO.read(new File("/MYFirst/src/images/login.png"));
      
        eleI = eleI.getScaledInstance(login.getWidth(), login.getHeight(),Image.SCALE_REPLICATE);
        elei = new ImageIcon(eleI);
        login.setIcon(elei);
        } catch (IOException e) {
            // TODO Auto-generated catch block
          
        }          
    }
   
    @Override
    public void mouseEntered(MouseEvent arg0) {
        try {
            eleI = ImageIO.read(new File("/MyFirst/src/images/loginhover.png"));
      
        eleI = eleI.getScaledInstance(login.getWidth(), login.getHeight(),Image.SCALE_REPLICATE);
        elei = new ImageIcon(eleI);
        login.setIcon(elei);
        } catch (IOException e) {
            // TODO Auto-generated catch block
          
        }          
    }
   
    @Override
    public void mouseClicked(MouseEvent arg0) {
        // TODO Auto-generated method stub
      
    }
});

user.addMouseListener(new MouseListener() {
   
    @Override
    public void mouseReleased(MouseEvent e) {
        user.setText("");
      
    }
   
    @Override
    public void mousePressed(MouseEvent e) {
        // TODO Auto-generated method stub
      
    }
   
    @Override
    public void mouseExited(MouseEvent e) {
        // TODO Auto-generated method stub
      
    }
   
    @Override
    public void mouseEntered(MouseEvent e) {
        // TODO Auto-generated method stub
      
    }
   
    @Override
    public void mouseClicked(MouseEvent e) {
        // TODO Auto-generated method stub
      
    }
});

pass.addMouseListener(new MouseListener() {
   
    @Override
    public void mouseReleased(MouseEvent e) {
        pass.setText("");
      
    }
   
    @Override
    public void mousePressed(MouseEvent e) {
        // TODO Auto-generated method stub
      
    }
   
    @Override
    public void mouseExited(MouseEvent e) {
        // TODO Auto-generated method stub
      
    }
   
    @Override
    public void mouseEntered(MouseEvent e) {
        // TODO Auto-generated method stub
      
    }
   
    @Override
    public void mouseClicked(MouseEvent e) {
        // TODO Auto-generated method stub
      
    }
});
    }

    public static void main(String[] args) throws Exception {
        FirstGUI g=new FirstGUI();

    }
}
 

Here are the images that you will require place it in the image folder and store it in the src folder of your eclipse Java project Folder:





If you have found any difficulties, feel free to comment me. I will definitely try to answer those questions. In the further tutorials I will demonstrate more complex designs so that you can design your own GUI Application.

Happy Programming with Designing

No comments: