Panel which 'slides open' - use timer to change height

Question

I think probably I have the wrong idea here - can someone set me straight? I have a label which when clicked causes a panel to appear - i did this with panel.visible = true - in fact it is pretty clunky though and I would love to have it slide open.

So I used a for-next loop to change the height of the panel dynamically, which I tried to slow up with a timer. But I'm doing something wrong:

Sub button_click
For i = 1 to 500
counter = i
timer1.initialize("timer1", 50)
timer1.enabled = true
next
End sub

sub timer1_click
panel.height = counter
timer1.enabled=false
end sub

This has the effect of a long delay and then the panel appears. Not quite what I was after. Does simply stating panel.height = xx cause the panel to be redrawn or do I have to use animation?

thanks....

Answer 1

You are initializing the timer 500 times by having it in the loop. This may cause the timer to excute immediately for 500 times instead of for the interval set. This, in turn, would not allow time for the panel to be redrawn. Even if it the code were right, an interval of 50 is 5/100ths of a second repeated 500 times is 25 seconds. That's a long time to sit and watch a panel go up.

However, even if you reduced the interval to 1, it could take about the same amount of time just to redraw the panel 500 times, depending on the device and the number of views on the panel. This means that you have to move more than 1 pixel at a time. To get the moving time down to a reasonable number of seconds, you could use an interval of 1 and move 5 pixels at a time, which works, but the movement is not very smooth. Also, the speed of movement can vary quite a bit on different devices, say from a 4" phone to a 10" tablet.

Sub Activity_Create
   timer1.initialize("timer1", 1) 
   timer1.enabled = false
end sub

Sub button_click
   counter1 = 0 ' counter1 should be DIMed in Sub Globals
   timer1.enabled = true
end sub

Sub timer1_tick ' Note: not "time1_click"
   counter1 = counter1 + 5
   panel.Height = counter1
   if counter1 = 500 then
      timer1.enabled = false
   end if
End Sub

Answer 2

You should really use an animation. You have a good example here :

Android Left to Right slide animation

Answer 3

You need to use Animation. Below is the code which is used for sliding up/down animation

 btn.setOnClickListener(new OnClickListener()
        {

            public void onClick(View arg0) {


                isOpen=!isOpen;
                if(isOpen)
                { //
                    lin1.getLayoutParams().height=actualHeight;
                        btn.setBackgroundResource(R.drawable.header_uparrow);

                }
                else
                    btn.setBackgroundResource(R.drawable.header_downarrow);
                ani a=new ani();
                a.setDuration(2000);

        lin1.startAnimation(a);
                }

            //}

        }); 
class ani extends Animation
    {


        public ani()
        {

        }
          @Override
          protected void applyTransformation(float interpolatedTime, Transformation t) {
              int newHeight;
              if(isOpen)
              newHeight = (int)(initialHeight * interpolatedTime);
              else
                  newHeight = (int)(initialHeight * (1-interpolatedTime));

              lin1.getLayoutParams().height = newHeight;
              lin1.requestLayout();

          }

          @Override
          public void initialize(int width, int height, int parentWidth, int parentHeight) {
              super.initialize(width, height, parentWidth, parentHeight);

              initialHeight = actualHeight;


          }

          @Override
          public boolean willChangeBounds() {
              return true;
          }
      };