эффект скольжения в Titanium слева направо

Я пробую скользящий эффект с анимацией слева направо в Титаниуме. Я достиг большей части этого, но есть некоторая ошибка, когда есть первый переход слева направо. Вот код.

<Alloy>
<Window id = "win" onOpen="openCurrentIssue">
    <View id="view1"  width="75%" height="Ti.UI.FILL" left="0%" >
        <TableView id="menuTable"></TableView>
    </View>
    <View id="view2"  width="Ti.UI.FILL" height="Ti.UI.FILL" backgroundColor="#A9F5A9" >

        <View id="viewcheck1" >
            <Label id="title" width="Ti.UI.SIZE" text="Title" height="Ti.UI.SIZE" textAlign="Ti.UI.TEXT_ALIGNMENT_CENTER" color="black"></Label>
            <ImageView id="menuImg" image="/images/menu.png" onClick="showsideBar" left="5"></ImageView>
        </View>

        <View id="viewcheck2"  width="Ti.UI.SIZE" height="Ti.UI.SIZE" backgroundColor="#A9F5A9" >

            <Label id="cIssue" text="Demo" width="Ti.UI.SIZE" height="Ti.UI.SIZE" textAlign="Ti.UI.TEXT_ALIGNMENT_CENTER" top="10" color="black"></Label>
            <ImageView id="cImage" width="Ti.UI.SIZE" height="Ti.UI.SIZE" top="45"></ImageView>
            <Button id="cButton" title="Advertiser"></Button>
        </View>

        <View id="viewBelow" width="150" height="Ti.UI.FILL" backgroundColor="#A9A5A9" left="0%" visible="false" top="40">
            <TableView id="menuTable"></TableView>
        </View>

    </View>
</Window>

Here is the index.js file

var isMenu = false;
function showsideBar(e) {
try {
    if (isMenu) {
    $.viewBelow.animate({
        left : -150,
        duration : 300,
        curve : Ti.UI.ANIMATION_CURVE_EASE_IN_OUT
    });
    isMenu = false;
} else {
    $.viewBelow.visible=true;
    $.viewBelow.animate({
        left : 0, 
        duration : 300,
        curve : Ti.UI.ANIMATION_CURVE_EASE_IN_OUT
    });
    isMenu = true;
}

} catch(e) {
    Ti.API.info('Exception from index.js ' + e.value);

}}

Это линия, где лежит функция

<ImageView id="menuImg" image="/images/menu.png" onClick="showsideBar" left="5"></ImageView>

В первый раз свойство visible становится истинным, и эффект слева направо не появляется, и после первого перехода он работает, как ожидалось. Может ли кто-нибудь помочь мне найти ошибку в приведенном выше коде для начального перехода.


android titanium appcelerator-mobile titanium-alloy
person Bunny    schedule 09.07.2015    source источник
comment
У меня была аналогичная проблема при вращении изображений. Мое решение было немного грязным: я просто однажды программно запустил вращение после инициализации представления. После поворота на 360 градусов все заработало как положено. Вы можете попробовать, хотя это необычно.   -  person Robin Ellerkmann    schedule 09.07.2015
comment
Вы можете попробовать модификацию @swanand. :-) Это решило мою ошибку.   -  person Bunny    schedule 10.07.2015

Ответы (1)


arrow_upward
4
arrow_downward

Я изменил часть вашего кода

<View id="viewBelow" width="150" height="Ti.UI.FILL" backgroundColor="#A9A5A9" left="-150" visible="false" top="40">
    <TableView id="menuTable"></TableView>
</View>

Измените left с 0% на -150 и все заработает. Потому что ранее вы уже дали ему 0, а затем анимировали свой вид снова 0 и сделали его видимым. После изменения его на -150 теперь в первый раз левый вид анимируется с -150 на 0.

person Swanand    schedule 10.07.2015
comment
Здорово. Попробовал вашу модификацию. Он работает именно так, как ожидалось :-) - person Bunny; 10.07.2015
comment
Если вы найдете это полезным, пожалуйста, примите ответ также .. :) - person Swanand; 10.07.2015