Angle для мувиклипа(круговой прелоадер)

[dmitry bond]

Добрый день
Кто нибудь сталкивался с созданием кругового прелоадера, когда линия загрузки идет по кругу.
У меня идея создать это с помощью angle(start angle, end angle), но встретился с проблемой, существуют ли такие параметры у мувиклипа в as3. У овальной области в овал параметрс эти параметры есть.

[nOobCrafter]

был пример с программной отрисовкой окружности, но т.к. за раз отрисовывается градус то выглядит не гладко, так же можно руками нарисовать.

[Tails]

Можно так например:
Нарисовать ручками мувиклип, где допустим за 100 кадров круг заполняется. И в класе прелоадера просто отображать его № кадра, соответствующего %-у загруженного.

Если без анимаций, тогда отрисовать линию загрузки как полу-круг под маской, и манипулировать ротацией

[expl]

Эти круговые загрузки 2-мя способами делают:
1. 100-кадровый анимированный ролик (в котором балуются вращением масок в виде половины бублика и движением самой линии в виде половины бублика)
2. маска или сама линия рисуется с помощью матана. Можно погуглив найти библиотеки, позволяющие рисовать дуги. Само API флешплеера такого не умеет - только кривые безье.

О, рисование сигмента у себя нашёл:

        public static function drawArc(g:Graphics, begin:Number, end:Number, radius:Number, color:uin):void
	{
		g.beginFill(color.getColor(), color.getAlpha());
		g.moveTo(0, 0);
 
		var numSegments:int = Math.ceil((end - begin) * 4 / Math.PI);
		var deltaAngle:Number = (end - begin) / numSegments;
		var externalRadius:Number = radius / Math.cos(deltaAngle * .5);
		g.lineTo(Math.cos(begin) * radius, Math.sin(begin) * radius);
		for (var i:int = 0; i < numSegments; i++)
		{
			var angle:Number = begin + (i + 1) * deltaAngle;
			var halfAngle:Number = begin + (i + .5) * deltaAngle;
			var x1:Number = Math.cos(halfAngle) * externalRadius;
			var y1:Number = Math.sin(halfAngle) * externalRadius;
			var x2:Number = Math.cos(angle) * radius;
			var y2:Number = Math.sin(angle) * radius;
			g.curveTo(x1, y1, x2, y2);
		}
 
		g.lineTo(0, 0);
		g.endFill();
	}

[TanaTiX]

Собственно круги рисовать не обязательно, можно построить маску и на основе прямоугольника.

[expl]

Но там тоже не сахар - придется искать пересечение этой повернутой линии с одной из 4-х сторон этого прямоугольника.
...если только вручную (в этом 100-кадровом клипе) вместо круга прямоугольник изобразить - может чуть поменьше процессорного времени есть будет.

[SvetozarPNZ]

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

[Wolsh]

Както делал... Нужен был троббер вроде Spinning Wheel, но как-то легко получилась штука более универсальная – можно использовать и как прелоадер, вычисляя нужный угол сектора, и как маску для шкалы вращающейся ручки-слайдера. По сути это просто рисовалка сектора с "дыркой" или без (innerRadius = 0) с задаваемым начальным углом (rotation) и длиной дуги (arc) – всё в градусах.

Throbber.swf   (2.3 Кб)

По какому-нибудь событию производим обновление ( update() ). Для троббера просто слушаем ентерФрейм и меняем стартовый угол (пример 1). Для прелоадера или шкалы соответственно вычисляем длину дуги (по проценту загрузки/углу поворота ручки) и меняем ее, оставляя стартовый угол постоянным (пример 2 и 3).

[a7s1h1]

Сообщение от Wolsh

Както делал... Нужен был троббер вроде Spinning Wheel, но как-то легко получилась штука более универсальная – можно использовать и как прелоадер, вычисляя нужный угол сектора, и как маску для шкалы вращающейся ручки-слайдера. По сути это просто рисовалка сектора с "дыркой" или без (innerRadius = 0) с задаваемым начальным углом (rotation) и длиной дуги (arc) – всё в градусах.

Очень удобно. Правда, при таком обилии вычислений без комментариев взрывается мозг.