Mercurial > MadButterfly
changeset 297:e885dc875f30
Implement animation menu
author | wycc |
---|---|
date | Wed, 04 Feb 2009 01:23:45 +0800 |
parents | 2e97e8082d83 |
children | 959c4ac544a1 |
files | examples/menu/list.svg examples/menu/main.c |
diffstat | 2 files changed, 323 insertions(+), 124 deletions(-) [+] |
line wrap: on
line diff
--- a/examples/menu/list.svg Sun Feb 01 16:28:28 2009 +0800 +++ b/examples/menu/list.svg Wed Feb 04 01:23:45 2009 +0800 @@ -31,7 +31,7 @@ inkscape:cx="375" inkscape:cy="177.14286" inkscape:document-units="px" - inkscape:current-layer="lightbar" + inkscape:current-layer="layer1" showgrid="false" inkscape:window-width="1124" inkscape:window-height="867" @@ -40,12 +40,12 @@ <defs id="defs4"> <inkscape:perspective - id="perspective10" - inkscape:persp3d-origin="372.04724 : 350.78739 : 1" + sodipodi:type="inkscape:persp3d" + inkscape:vp_x="0 : 526.18109 : 1" + inkscape:vp_y="0 : 1000 : 0" inkscape:vp_z="744.09448 : 526.18109 : 1" - inkscape:vp_y="0 : 1000 : 0" - inkscape:vp_x="0 : 526.18109 : 1" - sodipodi:type="inkscape:persp3d" /> + inkscape:persp3d-origin="372.04724 : 350.78739 : 1" + id="perspective10" /> </defs> <metadata id="metadata7"> @@ -61,147 +61,164 @@ current="1" /> </metadata> <g - id="layer1" + inkscape:label="Layer 1" inkscape:groupmode="layer" - inkscape:label="Layer 1"> + id="layer1"> <g - id="item1" - mbname="item1"> + mbname="item1" + id="item1"> <text - id="text2395" + xml:space="preserve" + style="font-size:24px;font-style:normal;font-weight:normal;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;font-family:Bitstream Vera Sans" + x="157.14285" y="60" - x="157.14285" - style="font-size:24px;font-style:normal;font-weight:normal;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;font-family:Bitstream Vera Sans" - xml:space="preserve"><tspan - mbname="item1text" + id="text2395"><tspan + sodipodi:role="line" + id="tspan2397" + x="157.14285" y="60" - x="157.14285" - id="tspan2397" - sodipodi:role="line">item1</tspan></text> + mbname="item1text">item1</tspan></text> </g> <g - transform="translate(-0.4896719,34.661551)" + mbname="item2" id="item2" - mbname="item2"> + transform="translate(-0.4896719,34.661551)"> <text - id="text2421" - y="60" + xml:space="preserve" + style="font-size:24px;font-style:normal;font-weight:normal;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;font-family:Bitstream Vera Sans" x="157.14285" - style="font-size:24px;font-style:normal;font-weight:normal;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;font-family:Bitstream Vera Sans" - xml:space="preserve"><tspan - mbname="item2text" + y="60" + id="text2421"><tspan + sodipodi:role="line" + id="tspan2423" + x="157.14285" y="60" - x="157.14285" - id="tspan2423" - sodipodi:role="line">item1</tspan></text> + mbname="item2text">item1</tspan></text> </g> <g - transform="translate(1.1837399,71.616487)" + mbname="item3" id="item3" - mbname="item3"> + transform="translate(1.1837399,71.616487)"> <text - id="item3text" - y="60" + xml:space="preserve" + style="font-size:24px;font-style:normal;font-weight:normal;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;font-family:Bitstream Vera Sans" x="157.14285" - style="font-size:24px;font-style:normal;font-weight:normal;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;font-family:Bitstream Vera Sans" - xml:space="preserve"><tspan - mbname="item3text" + y="60" + id="item3text"><tspan + sodipodi:role="line" + id="tspan2429" + x="157.14285" y="60" - x="157.14285" - id="tspan2429" - sodipodi:role="line">item1</tspan></text> + mbname="item3text">item1</tspan></text> </g> <g - transform="translate(0.6940599,106.27804)" + mbname="item4" id="item4" - mbname="item4"> + transform="translate(0.6940599,106.27804)"> <text - id="item4text" - y="60" + xml:space="preserve" + style="font-size:24px;font-style:normal;font-weight:normal;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;font-family:Bitstream Vera Sans" x="157.14285" - style="font-size:24px;font-style:normal;font-weight:normal;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;font-family:Bitstream Vera Sans" - xml:space="preserve"><tspan - mbname="item4text" + y="60" + id="item4text"><tspan + sodipodi:role="line" + id="tspan2435" + x="157.14285" y="60" - x="157.14285" - id="tspan2435" - sodipodi:role="line">item1</tspan></text> + mbname="item4text">item1</tspan></text> </g> <g - transform="translate(-0.8367057,141.52253)" + mbname="item5" id="item5" - mbname="item5"> + transform="translate(-0.8367057,141.52253)"> <text - id="item5text" - y="60" + xml:space="preserve" + style="font-size:24px;font-style:normal;font-weight:normal;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;font-family:Bitstream Vera Sans" x="157.14285" - style="font-size:24px;font-style:normal;font-weight:normal;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;font-family:Bitstream Vera Sans" - xml:space="preserve"><tspan - mbname="item5text" + y="60" + id="item5text"><tspan + sodipodi:role="line" + id="tspan2441" + x="157.14285" y="60" - x="157.14285" - id="tspan2441" - sodipodi:role="line">item1</tspan></text> + mbname="item5text">item1</tspan></text> </g> <g - transform="translate(-1.3263777,176.18408)" + mbname="item6" id="item6" - mbname="item6"> + transform="translate(-1.3263777,176.18408)"> <text - id="item6text" - y="60" + xml:space="preserve" + style="font-size:24px;font-style:normal;font-weight:normal;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;font-family:Bitstream Vera Sans" x="157.14285" - style="font-size:24px;font-style:normal;font-weight:normal;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;font-family:Bitstream Vera Sans" - xml:space="preserve"><tspan - mbname="item6text" + y="60" + id="item6text"><tspan + sodipodi:role="line" + id="tspan2447" + x="157.14285" y="60" - x="157.14285" - id="tspan2447" - sodipodi:role="line">item1</tspan></text> + mbname="item6text">item1</tspan></text> </g> <g - transform="translate(0.3470343,213.13901)" + mbname="item7" id="item7" - mbname="item7"> + transform="translate(0.3470343,213.13901)"> <text - id="item7text" - y="60" + xml:space="preserve" + style="font-size:24px;font-style:normal;font-weight:normal;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;font-family:Bitstream Vera Sans" x="157.14285" - style="font-size:24px;font-style:normal;font-weight:normal;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;font-family:Bitstream Vera Sans" - xml:space="preserve"><tspan - mbname="item7text" + y="60" + id="item7text"><tspan + sodipodi:role="line" + id="tspan2453" + x="157.14285" y="60" - x="157.14285" - id="tspan2453" - sodipodi:role="line">item1</tspan></text> + mbname="item7text">item1</tspan></text> </g> <g - transform="translate(-0.1426457,247.80057)" + mbname="item8" id="item8" - mbname="item8"> + transform="translate(-0.1426457,247.80057)"> <text - id="item8text" - y="60" + xml:space="preserve" + style="font-size:24px;font-style:normal;font-weight:normal;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;font-family:Bitstream Vera Sans" x="157.14285" - style="font-size:24px;font-style:normal;font-weight:normal;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;font-family:Bitstream Vera Sans" - xml:space="preserve"><tspan - mbname="item8text" + y="60" + id="item8text"><tspan + sodipodi:role="line" + id="tspan2459" + x="157.14285" y="60" - x="157.14285" - id="tspan2459" - sodipodi:role="line">item1</tspan></text> + mbname="item8text">item1</tspan></text> </g> <g - mbname="lightbar" + id="lightbar" transform="translate(0,157)" - id="lightbar"> + mbname="lightbar"> <rect - style="opacity:0.3669725;fill:#0068d3;fill-opacity:1;stroke:#00d300;stroke-width:0.99680871;stroke-opacity:1" - id="rect2405" + y="22.784119" + x="-0.93016708" + height="44.003193" width="442.86035" - height="44.003193" - x="-0.93016708" - y="22.784119" /> + id="rect2405" + style="opacity:0.3669725;fill:#0068d3;fill-opacity:1;stroke:#00d300;stroke-width:0.99680871;stroke-opacity:1" /> + </g> + <g + mbname="item9" + id="item9" + transform="translate(2.3674709,278.94727)"> + <text + xml:space="preserve" + style="font-size:24px;font-style:normal;font-weight:normal;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;font-family:Bitstream Vera Sans" + x="157.14285" + y="60" + id="text2407" + mbname=""><tspan + sodipodi:role="line" + id="tspan2409" + x="157.14285" + y="60" + mbname="item9text">item1</tspan></text> </g> </g> </svg>
--- a/examples/menu/main.c Sun Feb 01 16:28:28 2009 +0800 +++ b/examples/menu/main.c Wed Feb 04 01:23:45 2009 +0800 @@ -1,6 +1,14 @@ /*! \file * * This is the demo program for the animated menu. We will use to test the MBAF API. + * We need to have group item1-item9 in the SVG file. Initially, we will show + * item1-item8 only. When a up/down key is pressed, we will draw the next item in item9 and + * add two words to move item1-item9 smoothly. The first word move items to the 3/4 position + * fastly. The second will move it from 3/4 to the final position slowly to make retard effect. + * + * If we press another key before the second words finish, we will delete the word and replace + * it with a word to move it fastly to the final position and then we will repeat the procedure + * to add another two words to move it to the next position. */ #include <stdio.h> #include <mb.h> @@ -29,6 +37,10 @@ "Item 18", }; +int menus_y[10]; +int items[10]; + + typedef struct { int top; int cur; @@ -42,38 +54,194 @@ int i; MyAppData *data = MBAPP_DATA(myApp,MyAppData); mb_sprite_t *sprite=myApp->rootsprite; + coord_t *textgroup; shape_t *text; coord_t *group; coord_t *lightbar; char name[255]; + int tmp; + mb_timeval_t start, playing, now; + mb_progm_t *progm; + mb_word_t *word; + + // fill new item for(i=0;i<8;i++) { - if (i+data->top > data->max) break; - snprintf(name,sizeof(name),"item%dtext", i+1); - text = (shape_t *) MB_SPRITE_GET_OBJ(sprite, name); - if (text == NULL) { - printf("Can not find object %s\n",name); - continue; - } - sh_text_set_text(text,menus[i+data->top]); - rdman_shape_changed(MBAPP_RDMAN(myApp), text); + snprintf(name, sizeof(name),"item%dtext", items[i]); + text = (shape_t *) MB_SPRITE_GET_OBJ(sprite,name); + sh_text_set_text(text, menus[data->top+i]); + rdman_shape_changed(MBAPP_RDMAN(myApp),text); } - for(;i<8;i++) { - snprintf(name,sizeof(name),"item%dtext", i+1); - text = (shape_t *) MB_SPRITE_GET_OBJ(sprite, name); - if (text == NULL) { - printf("Can not find object %s\n",name); - continue; - } - sh_text_set_text(text,""); - rdman_shape_changed(MBAPP_RDMAN(myApp), text); - } + + + snprintf(name, sizeof(name),"item%d", items[i]); + textgroup = (coord_t *) MB_SPRITE_GET_OBJ(sprite,name); + coord_hide(textgroup); + rdman_coord_changed(MBAPP_RDMAN(myApp),textgroup); + lightbar = (coord_t *) MB_SPRITE_GET_OBJ(sprite, "lightbar"); snprintf(name,sizeof(name),"item%d", data->cur+1); group = (coord_t *) MB_SPRITE_GET_OBJ(sprite, name); coord_x(lightbar) = coord_x(group); coord_y(lightbar) = coord_y(group); - rdman_coord_changed(MBAPP_RDMAN(myApp), lightbar); + rdman_redraw_changed(MBAPP_RDMAN(myApp)); +} + +static void fillMenuContentUp() +{ + int i; + MyAppData *data = MBAPP_DATA(myApp,MyAppData); + mb_sprite_t *sprite=myApp->rootsprite; + coord_t *textgroup; + shape_t *text; + coord_t *group; + coord_t *lightbar; + char name[255]; + int tmp; + mb_timeval_t start, playing, now; + mb_progm_t *progm; + mb_word_t *word; + + + // fill new item + snprintf(name, sizeof(name),"item%dtext", items[8]); + text = (shape_t *) MB_SPRITE_GET_OBJ(sprite,name); + sh_text_set_text(text, menus[data->top]); + + progm = mb_progm_new(2, MBAPP_RDMAN(myApp)); + MB_TIMEVAL_SET(&start, 0, 0); + MB_TIMEVAL_SET(&playing, 0, 300000); + word = mb_progm_next_word(progm, &start, &playing); + get_now(&now); + + for(i=0;i<7;i++) { + //shift to the next item + snprintf(name, sizeof(name),"item%d", items[i]); + textgroup = (coord_t *) MB_SPRITE_GET_OBJ(sprite,name); + mb_shift_new(0,menus_y[i+1]-coord_y(textgroup), textgroup,word); + } + // fade out the item[7] + snprintf(name, sizeof(name),"item%d", items[7]); + textgroup = (coord_t *) MB_SPRITE_GET_OBJ(sprite,name); + mb_shift_new(0,100, textgroup,word); + mb_visibility_new(VIS_HIDDEN, textgroup,word); + + // fade in the item[8] + snprintf(name, sizeof(name),"item%d", items[8]); + textgroup = (coord_t *) MB_SPRITE_GET_OBJ(sprite,name); + snprintf(name,sizeof(name),"item%d", items[0]); + group = (coord_t *) MB_SPRITE_GET_OBJ(sprite,name); + coord_y(textgroup) = menus_y[0]-100; + coord_show(textgroup); + mb_shift_new(0,100, textgroup,word); + + lightbar = (coord_t *) MB_SPRITE_GET_OBJ(sprite, "lightbar"); + mb_shift_new(0,menus_y[data->cur]-coord_y(lightbar),lightbar,word); + + MB_TIMEVAL_SET(&start, 0, 300000); + MB_TIMEVAL_SET(&playing, 0, 0); + word = mb_progm_next_word(progm, &start, &playing); + snprintf(name, sizeof(name),"item%d", items[8]); + textgroup = (coord_t *) MB_SPRITE_GET_OBJ(sprite,name); + mb_visibility_new(VIS_VISIBLE, textgroup,word); + + mb_progm_free_completed(progm); + mb_progm_start(progm, X_MB_tman(MBAPP_RDMAN(myApp)->rt), &now); + rdman_redraw_changed(MBAPP_RDMAN(myApp)); + tmp = items[8]; + for(i=8;i>0;i--) { + items[i] = items[i-1]; + } + items[0] = tmp; +} +static void fillMenuContentDown() +{ + int i; + MyAppData *data = MBAPP_DATA(myApp,MyAppData); + mb_sprite_t *sprite=myApp->rootsprite; + coord_t *textgroup; + shape_t *text; + coord_t *group; + coord_t *lightbar; + char name[255]; + int tmp; + mb_timeval_t start, playing, now; + mb_progm_t *progm; + mb_word_t *word; + + + // fill new item + snprintf(name, sizeof(name),"item%dtext", items[8]); + text = (shape_t *) MB_SPRITE_GET_OBJ(sprite,name); + sh_text_set_text(text, menus[data->top+7]); + + progm = mb_progm_new(2, MBAPP_RDMAN(myApp)); + MB_TIMEVAL_SET(&start, 0, 0); + MB_TIMEVAL_SET(&playing, 0, 300000); + word = mb_progm_next_word(progm, &start, &playing); + get_now(&now); + + for(i=1;i<8;i++) { + //shift to the next item + snprintf(name, sizeof(name),"item%d", items[i]); + textgroup = (coord_t *) MB_SPRITE_GET_OBJ(sprite,name); + mb_shift_new(0,menus_y[i-1]-coord_y(textgroup), textgroup,word); + } + // fade out the item[0] + snprintf(name, sizeof(name),"item%d", items[0]); + textgroup = (coord_t *) MB_SPRITE_GET_OBJ(sprite,name); + mb_shift_new(0,-100, textgroup,word); + + // fade in the item[8] + snprintf(name, sizeof(name),"item%d", items[8]); + textgroup = (coord_t *) MB_SPRITE_GET_OBJ(sprite,name); + coord_y(textgroup) = menus_y[7]+100; + coord_show(textgroup); + mb_shift_new(0,-100, textgroup,word); + + lightbar = (coord_t *) MB_SPRITE_GET_OBJ(sprite, "lightbar"); + mb_shift_new(0,menus_y[data->cur]-coord_y(lightbar),lightbar,word); + + MB_TIMEVAL_SET(&start, 0, 300001); + MB_TIMEVAL_SET(&playing, 0, 0); + word = mb_progm_next_word(progm, &start, &playing); + snprintf(name, sizeof(name),"item%d", items[0]); + textgroup = (coord_t *) MB_SPRITE_GET_OBJ(sprite,name); + mb_visibility_new(VIS_VISIBLE, textgroup,word); + + mb_progm_free_completed(progm); + mb_progm_start(progm, X_MB_tman(MBAPP_RDMAN(myApp)->rt), &now); + rdman_redraw_changed(MBAPP_RDMAN(myApp)); + tmp = items[0]; + for(i=0;i<8;i++) { + items[i] = items[i+1]; + } + items[8] = tmp; +} + +MoveLightBar() +{ + mb_sprite_t *sprite=myApp->rootsprite; + MyAppData *data = MBAPP_DATA(myApp,MyAppData); + mb_timeval_t start, playing, now; + mb_progm_t *progm; + mb_word_t *word; + coord_t *group; + coord_t *lightbar; + char name[255]; + + progm = mb_progm_new(1, MBAPP_RDMAN(myApp)); + MB_TIMEVAL_SET(&start, 0, 0); + MB_TIMEVAL_SET(&playing, 0, 200000); + word = mb_progm_next_word(progm, &start, &playing); + get_now(&now); + + lightbar = (coord_t *) MB_SPRITE_GET_OBJ(sprite, "lightbar"); + snprintf(name,sizeof(name),"item%d", items[data->cur]); + group = (coord_t *) MB_SPRITE_GET_OBJ(sprite, name); + mb_shift_new(coord_x(group)-coord_x(lightbar),coord_y(group)-coord_y(lightbar),lightbar,word); + mb_progm_free_completed(progm); + mb_progm_start(progm, X_MB_tman(MBAPP_RDMAN(myApp)->rt), &now); rdman_redraw_changed(MBAPP_RDMAN(myApp)); } @@ -81,38 +249,42 @@ { MyAppData *data = MBAPP_DATA(myApp,MyAppData); - if (data->cur > 5) + if (data->cur > 5) { data->cur--; - else { + MoveLightBar(); + } else { if (data->top > 0) { data->top--; + fillMenuContentUp(); } else { if (data->cur == 0) return; data->cur--; + MoveLightBar(); } } - fillMenuContent(); } void menu_down() { MyAppData *data = MBAPP_DATA(myApp,MyAppData); - if (data->cur < 5) { - if (data->top+data->cur <= data->max) + if (data->cur < 4) { + if (data->top+data->cur <= data->max) { data->cur++; + MoveLightBar(); + } } else { if ((data->top+8) < data->max) { data->top++; + fillMenuContentDown(); } else { - if (data->cur+data->top < data->max-1) + if (data->cur+data->top < data->max-1) { data->cur++; - else + MoveLightBar(); + } else return; } - printf("top=%d\n",data->top); } - fillMenuContent(); } void menu_select() { @@ -154,10 +326,20 @@ { MyAppData *data = MBAPP_DATA(myApp,MyAppData); subject_t *key = MBAPP_keySubject(myApp); + char name[255]; + coord_t *l; + int i; + mb_sprite_t *sprite=myApp->rootsprite; data->top = 0; data->cur = 0; data->max = sizeof(menus)/sizeof(int)-1; + for(i=0;i<9;i++) { + items[i] = i+1; + snprintf(name,255,"item%d", i+1); + l = (coord_t *) MB_SPRITE_GET_OBJ(sprite,name); + menus_y[i] = coord_y(l); + } fillMenuContent(); subject_add_observer(key, keyHandler,NULL);