เคลื่อนไหวสองมุมมองในไทเทเนียม

ฉันมีสองมุมมองที่แสดงในหน้าต่างดังนี้

var topView = Ti.UI.createView({
  top: 0,
  height: '65%',
  orientation: 'vertical'
});
var botView = Ti.UI.createView({
  bottom: 0,
  height: '35%',
  layout: 'vertical'
});

ฉันต้องการเคลื่อนไหวดังนี้:

เมื่อคลิกปุ่ม topView จะเพิ่มขึ้นเป็นร้อยเปอร์เซ็นต์ ในขณะที่ botView จะลดลงเหลือ 0 เปอร์เซ็นต์ และการย้อนกลับจะเกิดขึ้นเมื่อมีการคลิกปุ่ม

แต่ฉันไม่พบวิธีที่จะทำสองมุมมอง ฉันหวังว่าจะมีคนช่วยได้ ขอบคุณ -:)

แก้ไข: นี่คือสิ่งที่ฉันได้ทำไปแล้ว:

var expandFlag = false;

/* create animations */
  var expandAnim_map = Ti.UI.createAnimation({
      height : '100%',
      duration: 300
  });
  var expandAnim_con = Ti.UI.createAnimation({
    height: '0%',
    duration : 300,
    bottom:0
  });

  var collapseAnim_map = Ti.UI.createAnimation({
      height: '65%',
      duration: 300,
  });
  var collapseAnim_con = Ti.UI.createAnimation({
      height: '35%',
      duration: 300,
      bottom:0
  });

  /* create animations */


if (expandFlag) {
  botView.animate(collapseAnim_con);
  topView.animate(collapseAnim_map);
  expandFlag = false;
} else {
  topView.animate(expandAnim_map);
  botView.animate(expandAnim_con);
  expandFlag = true;
}

นี่เป็นสิ่งที่ไม่สม่ำเสมอและไม่สวยงาม ดังนั้นฉันกำลังมองหาวิธีที่สะอาดและราบรื่นกว่านี้ ขอบคุณ.