Cannot paint over another rectangle

Question

After each tick of the timer the rectangle filled (Color.ORANGE) until the entire rectangle is colored, and then runs the rectangle empty again. The "Stop" button, will halt the painting. But when the code ties to slowly make the rectangle white, the rectangle is completely white.

How can I paint over the orange rectangle?

import java.awt.*;
import java.awt.event.*; 
import javax.swing.*; 

public class MyFrame extends JFrame implements ActionListener
{ 
    private JPanel beerPannel;
    private JButton startBtn;
    private JButton stopBtn;
    private Timer beerTimer;
    private int timeCountUp = 0;
    private int timeCountDown = 22;


    public MyFrame() {
        setLayout(new FlowLayout()); 

        // create textPlane
        beerPannel = new JPanel();
        beerPannel.setPreferredSize(new Dimension(250, 300)); 
        beerPannel.setBackground(Color.WHITE);

        // create startBtn
        startBtn = new JButton("Start");
        startBtn.addActionListener(this);

        // create stopBtn
        stopBtn = new JButton("Stop");
        stopBtn.addActionListener(this);

        // make timer
        beerTimer = new Timer(1000, this);

        // add to the screen
        add(beerPannel); add(startBtn); add(stopBtn);

        // config pop-up window 
        setSize(300, 380); 
        setVisible(true); 
        setDefaultCloseOperation(EXIT_ON_CLOSE); 
    }

    public void actionPerformed(ActionEvent event) {

        // start with a empty glass of beer
        Graphics beerGlass = beerPannel.getGraphics(); // set beerGlass ass writePanel
        // x -> y -> width -> height
        beerGlass.drawRect(50, 50, 150, 220); 

        // onClick startBtn
        if(event.getSource() == startBtn) {
            // start Timer
            beerTimer.start();
        }
        // onClick stopBtn          
        if(event.getSource() == stopBtn) {
            // stop Timer   
            beerTimer.stop();   
        }
        // als beer timer is gestart
        if(event.getSource() == beerTimer) {
            // count timeClicks
            int telUp = timeCountUp++;

            // standardt vars
            int width = 148;
            int x = 51;

            // start with a empty glass of beer

            // set color
            Graphics fillBeerGlass = beerPannel.getGraphics();

            if(telUp <= 22) { 
                // set height
                int height = 10 * telUp - 2;
                // set y
                int y = 259 - height + 10;      

                fillBeerGlass.setColor(Color.ORANGE); 
                fillBeerGlass.drawRect(x, y, width, height); 
                fillBeerGlass.fillRect(x, y, width, height); 

            } else {
                // count timeClicks
                int telDown = timeCountDown--;
                // verklein inhoud
                // set height
                int height = 10 * telDown - 2;
                // set y
                int y = 259 - height + 10;      

                // set color
                fillBeerGlass.setColor(Color.WHITE); 
                fillBeerGlass.drawRect(x, y, width, height); 
                fillBeerGlass.fillRect(x, y, width, height); 


                // if count 0, stop timer 
                if(telDown == 0) {
                    beerTimer.stop();
                }
            }
        }
    }
}

Answer 1

As mKorbel mentioned in a comment this is not the correct way to try to paint in Swing. Instead you need to create a component that has a state and repaints itself in entirety. Then have a Timer that changes the state (maybe from 50% full to 55% full for example), and forces a repaint. The timer can move the state up and down using the same method.