Масштаб 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, но я хочу использовать чисто спрайты для индикатора выполнения.
Решение
Смена спрайтов anchorPoint свойство к (0.f, 0.5f). Все преобразования выполняются относительно точки привязки узла. По умолчанию точка привязки спрайта равна (0.5f, 0.5f). Вот почему ваше масштабирование относится к центру вашего спрайта по умолчанию.
Другие решения
Другим способом, которым это может быть потенциально достигнуто, является использование метода 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];
}
редактировать Похоже, мой блок кода пропущен в последней закрывающей фигурной скобке — не забывайте об этом, если вы хотите попробовать метод рисования выше!