Страница 1 из 1

Сползает графический индикатор наполненности

Добавлено: 16 май 2014, 12:45
Agiliter
Добрый день! Сорри за корявое название темы, не пришло в голову ничего лучше. Нужно нарисовать прямоугольник, который бы показывал процент заполнения какой-либо величины. Например, в играх это опыт. Сам алгоритм прост и понятен, но где-то допущена ошибка.
Вот функция для нарисовки индикаторов прогресса

Код: Выделить всё

private function createIndicator(percent:Number, color:uint, x:int, y:int, lineColor:uint = 0xFFFFFF):void        {                           // создаем фон            background = new Shape();            background.graphics.lineStyle(1, lineColor);            background.graphics.beginFill(color, 0.6);                      background.graphics.drawRoundRect(x, y, 200, 20, 25, 25);            background.graphics.endFill();            this.addChild(background);                        // плашка которая будет отображать прогресс            fill = new Shape();            fill.graphics.lineStyle(1, lineColor);            fill.graphics.beginFill(color, 1);                      fill.graphics.drawRoundRect(x, y, 200, 20, 25, 25);            fill.graphics.endFill();            fill.scaleX = percent;            //fill.width *= percent;            this.addChild(fill);                    } 
Ну и

Код: Выделить всё

            createIndicator(0.10, 0xff9900, 500, 75);            createIndicator(0.20, 0xff9900, 500, 100);            createIndicator(0.30, 0xff9900, 500, 125);            createIndicator(0.40, 0xff9900, 500, 150);            createIndicator(0.50, 0xff9900, 500, 175);            createIndicator(0.60, 0xff9900, 500, 200);            createIndicator(0.70, 0xff9900, 500, 225);            createIndicator(0.80, 0xff9900, 500, 250);            createIndicator(0.90, 0xff9900, 500, 275);            createIndicator(1.00, 0xff9900, 500, 300);            createIndicator(1.10, 0xff9900, 500, 325);
Индикаторы рисуются, но при значениях percent неравных 100% плашка сползает влево/вправо. Использовал и .scaleX, и .width - результат один

Изображение

Re: Сползает графический индикатор наполненности

Добавлено: 16 май 2014, 14:04
sasha^
писать код не буду.. объясню на словах..
во-первых это называется прогрессбар(progressbar)
во-вторых при создании(заливке) fill.graphics.drawRoundRect(x, y, 200, 20, 25, 25); заливай не от x,y, а от 0.. потом уже выставляй всей полоске(графический индикатор наполненности :) ) x и y.. и будет все окей.
ps: а вообще лучше рассчитай длину и рисуй - не будет искажаться фигура...
удачи)