Масштаб CCSprite со стороны, а не из центра

Я пытаюсь сделать индивидуальный индикатор выполнения. То, что я хочу сделать, это иметь «barMask.png» с его шкалой Х в зависимости от процента от числа. Я пытался сделать это так:

barBack = CCSprite::create( "barBack.png" );
this -> addChild( barBack );

barMask = CCSprite::create( "barMask.png" );
barMask -> setPosition( barBack -> getPosition( ) );
this -> addChild( barMask );

Тогда на метод обновления

// Scale the width of barMask depending on the percentage of the progress.
barMask -> setScaleX( CURRENT_AMOUNT / TOTAL_AMOUNT );

Тем не менее, спрайт масштабируется следующим образом:

Frame 1: [ |||||||||| ]
Frame 2: [  ||||||||  ]
Frame 3: [   ||||||   ]

Он сжимается в середине. Как я могу сделать так, чтобы он сжимался влево / вправо? Как это:

Frame 1: [ |||||||||| ]
Frame 2: [ |||||||||  ]
Frame 3: [ ||||||||   ]
Frame 4: [ |||||||    ]

Я знаю о CCProgressTimer, но я хочу использовать чисто спрайты для индикатора выполнения.

2

Решение

Смена спрайтов anchorPoint свойство к (0.f, 0.5f). Все преобразования выполняются относительно точки привязки узла. По умолчанию точка привязки спрайта равна (0.5f, 0.5f). Вот почему ваше масштабирование относится к центру вашего спрайта по умолчанию.

3

Другие решения

Другим способом, которым это может быть потенциально достигнуто, является использование метода draw и небольшого количества openGL. Я использовал это для индикаторов здоровья для врагов в моем приложении «Космическая стрельба», которые масштабируются в зависимости от оставшегося HP врага. Это адаптировано из одного из учебных пособий Рэя Вендерлиха. Во всяком случае, вот мой метод рисования, он перебирает каждого «монстра» босса на экране и рисует их индикатор здоровья. Это может быть адаптировано, и метод, используемый для индикатора выполнения …

- (void)draw {

for (CCSprite *target in _targets) {
Monster *monster = (Monster *)target;

if (monster.monsterisboss == YES) {

static int lineBuffer = 5;
int lineHeight = 7;
int startY = monster.position.x - (monster.contentSize.width/2);
int endY = monster.position.x + (monster.contentSize.width/2) - lineBuffer;
int actualX = monster.position.y + (monster.contentSize.height/2) + lineHeight*2;

static int maxColor = 200;
static int colorBuffer = 55;
float percentage = ((float) monster.hp) / ((float) monster.maxHp);
int actualY = ((endY-startY) * percentage) + startY;
int amtRed = ((1.0f-percentage)*maxColor)+colorBuffer;
int amtGreen = (percentage*maxColor)+colorBuffer;

glEnable(GL_LINE_SMOOTH);

glLineWidth(lineHeight);
glColor4ub(amtRed,amtGreen,0,255);
ccDrawLine(ccp(startY, actualX), ccp(actualY, actualX));
}
}

[super draw];

}

редактировать Похоже, мой блок кода пропущен в последней закрывающей фигурной скобке — не забывайте об этом, если вы хотите попробовать метод рисования выше!

2