Основа для создания образовательных анимаций

Question

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

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

Я пытался писать подобные программы в обычных бесплатных платформах визуализации, которые я нашел в Интернете, например, processing.org и различные оболочки HTML-canvas, но главное, чего мне не хватало, - это объекта, который отображал бы / направлял анимацию в соответствии с моими командами.

Например, при обработке, если бы я создал объект с именем "королева", он должен быть нарисован на экране и перемещаться, как королева. Я должен был позаботиться о себе:

1. Отправка событий объекту Queen (если я хочу изменить его цвет, например, когда пользователь наводит на него курсор мыши).
2. Рисование объекта королевы на экране.

Поэтому мне пришлось написать в основном цикле код вида:

def mainloop():
    for obj in DrawableObjects: obj.draw()
def onclick(e):
    for obj in ResponsiveObjects: obj.handleClick(e)

Это безобразно и повторяется!

Я ожидаю, что инфраструктура анимации позволит мне использовать объекты, которые будут автоматически рисовать себя на экране (скажем, я буду определять для них ось z, чтобы решать пересечения), и автоматически, если я захочу, будет отвечать для взаимодействия с пользователем. Пример кода для моей воображаемой структуры будет:

class queen(DrawableObject):
    def __init__(self,boardX,boardY):
        self.boardX,self.boardY = boardX,boardY
        self.x = square_width*x+square_width/2
        self.y = square_height*y+square_height/2
    def draw(self):
        circle(x,y,radius)
    def move(self,direction_x,direction_y,squares):
        if direction_x
        #this would move the queen slowly to the desired direction
        self.boardX += direction_x*squares
        if self.boardX < 0:
             self.boardX = 0
             return
        #ditto for y
        ...
        #Let's pretend this function is blocking
        self.animated_transpose(
             direction_x*squares*square_width,
             direction_y*squares*squre_height
             )
    def delete(self):
        self.fadeOut()

При анимации королев я просто создаю новую королеву и использую функцию перемещения, чтобы перемещать ее, не беспокоясь о том, когда и где ее перебить. Рамки должны позаботиться об этом для меня. То есть:

def main():
    queens = []
    for i in range(8): queens.append(Queen(0,i))
    # find a solution by stupid random walk
    steps = 0
    while queens_threats_one_another(queens):
        queens[rand(8)].move(choose([-1,1],0,1)
        step += 1
    write_to_screen("did it with %d steps"%steps)

Другие полезные функции из этой среды, которые были бы удобны для веб. То есть JavaScript или Flash или Java. И это будет бесплатно.

Существует ли такая (или подобная) структура?

Answer 1

Поскольку архитектура отображения Flash основана на объектах, кажется, что она очень хорошо подходит для такого рода вещей. Существует также ряд библиотек анимации для Flash, которые очень упрощают подобные вещи.

Например, допустим, вы определили класс Queen, который расширил встроенный класс Sprite. Используя библиотеку TweenLite, код для создания и перемещения ферзя в течение 2 секунд будет выглядеть следующим образом:

var queen:Queen = new Queen();
queen.x = 100; // based on pixels, but you could easily create a square-to-pixel conversion
queen.y = 100;
addChild(queen); // assuming this code is in another DisplayObject, such as the stage

TweenLite.to(queen, 2, {x:200, y:300});