黑莓 - 字段布​​局动画 [英] Blackberry - fields layout animation

问题描述

这很容易显示一个领域内的一些动画 - BitmapField或屏幕：结果
[黑莓 - 背景图片/动画RIM OS 4.5.0] [1]

It's easy to show some animation within one field - BitmapField or Screen:
[Blackberry - background image/animation RIM OS 4.5.0][1]

但是，如果你需要移动字段，不只是形象？

But what if you need to move fields, not just images?

可能会用到：

• 游戏的工作流功能，如象棋，拼图等


• 应用用户定义的布局，像在谷歌小工具


• 强化界面的动画效果

所以，我想在交流这个任务我的expirience，在另一方面，我想知道任何其他的可能性，并提出建议。

So, I'd like to exchange my expirience in this task, on the other hand, I'd like to know about any others possibilities and suggestions.

推荐答案

这作用可能很容易地自定义布局achived：

This effect may be easily achived with custom layout:

class AnimatedManager extends Manager {
    int ANIMATION_NONE = 0;
    int ANIMATION_CROSS_FLY = 1;
    boolean mAnimationStart = false;
    Bitmap mBmpBNormal = Bitmap.getBitmapResource("blue_normal.png");
    Bitmap mBmpBFocused = Bitmap.getBitmapResource("blue_focused.png");
    Bitmap mBmpRNormal = Bitmap.getBitmapResource("red_normal.png");
    Bitmap mBmpRFocused = Bitmap.getBitmapResource("red_focused.png");
    Bitmap mBmpYNormal = Bitmap.getBitmapResource("yellow_normal.png");
    Bitmap mBmpYFocused = Bitmap.getBitmapResource("yellow_focused.png");
    Bitmap mBmpGNormal = Bitmap.getBitmapResource("green_normal.png");
    Bitmap mBmpGFocused = Bitmap.getBitmapResource("green_focused.png");
    int[] width = null;
    int[] height = null;
    int[] xPos = null;
    int[] yPos = null;
    BitmapButtonField mBButton = new BitmapButtonField(mBmpBNormal,
            mBmpBFocused);
    BitmapButtonField mRButton = new BitmapButtonField(mBmpRNormal,
            mBmpRFocused);
    BitmapButtonField mYButton = new BitmapButtonField(mBmpYNormal,
            mBmpYFocused);
    BitmapButtonField mGButton = new BitmapButtonField(mBmpGNormal,
            mBmpGFocused);

    public AnimatedManager() {
        super(USE_ALL_HEIGHT | USE_ALL_WIDTH);
        add(mBButton);
        add(mRButton);
        add(mYButton);
        add(mGButton);
        width = new int[] { mBButton.getPreferredWidth(),
                mRButton.getPreferredWidth(), 
                mYButton.getPreferredWidth(),
                mGButton.getPreferredWidth() };

        height = new int[] { mBButton.getPreferredHeight(),
                mRButton.getPreferredHeight(),
                mYButton.getPreferredHeight(),
                mGButton.getPreferredHeight() };

        xPos = new int[] { 0, getPreferredWidth() - width[1], 0,
                getPreferredWidth() - width[3] };
        yPos = new int[] { 0, 0, getPreferredHeight() - height[2],
                getPreferredHeight() - height[3] };

        Timer timer = new Timer();
        timer.schedule(mAnimationTask, 0, 100);
    }

    TimerTask mAnimationTask = new TimerTask() {
        public void run() {
            UiApplication.getUiApplication().invokeLater(new Runnable() {
                public void run() {
                    updateLayout();
                };
            });
        };
    };

    MenuItem mAnimationMenuItem = new MenuItem("Start", 0, 0) {
        public void run() {
            mAnimationStart = true;
        };
    };

    protected void makeMenu(Menu menu, int instance) {
        super.makeMenu(menu, instance);
        menu.add(mAnimationMenuItem);
    }

    public int getPreferredHeight() {
        return Display.getHeight();
    }

    public int getPreferredWidth() {
        return Display.getWidth();
    }

    protected void sublayout(int width, int height) {
        width = getPreferredWidth();
        height = getPreferredHeight();

        if (getFieldCount() > 3) {
            Field first = getField(0);
            Field second = getField(1);
            Field third = getField(2);
            Field fourth = getField(3);

            layoutChild(first, this.width[0], this.height[0]);
            layoutChild(second, this.width[1], this.height[1]);
            layoutChild(third, this.width[2], this.height[2]);
            layoutChild(fourth, this.width[3], this.height[3]);

            if (mAnimationStart) {
                boolean anim1 = performLayoutAnimation(0,
                        width - this.width[0], 
                        height - this.height[0]);
                boolean anim2 = performLayoutAnimation(1, 0, 
                        height - this.height[1]);
                boolean anim3 = performLayoutAnimation(2,
                        width - this.width[2], 0);
                boolean anim4 = performLayoutAnimation(3, 0, 0);
                mAnimationStart = anim1 || anim2 || anim3 || anim4;
            }
            setPositionChild(first, xPos[0], yPos[0]);
            setPositionChild(second, xPos[1], yPos[1]);
            setPositionChild(third, xPos[2], yPos[2]);
            setPositionChild(fourth, xPos[3], yPos[3]);

        }

        setExtent(width, height);
    }

    boolean performLayoutAnimation(int fieldIndex, int x, int y) {

        boolean result = false;
        if (xPos[fieldIndex] > x) {
            xPos[fieldIndex] -= 2;
            result = true;
        } else if (xPos[fieldIndex] < x) {
            xPos[fieldIndex] += 2;
            result = true;
        }

        if (yPos[fieldIndex] > y) {
            yPos[fieldIndex] -= 1;
            result = true;
        } else if (yPos[fieldIndex] < y) {
            yPos[fieldIndex] += 1;
            result = true;
        }
        return result;
    }
}

BitmapButtonField类我用：

BitmapButtonField class I've used:

class BitmapButtonField extends ButtonField {
    Bitmap mNormal;
    Bitmap mFocused;

    int mWidth;
    int mHeight;

    public BitmapButtonField(Bitmap normal, Bitmap focused) {
        super(CONSUME_CLICK);
        mNormal = normal;
        mFocused = focused;
        mWidth = mNormal.getWidth();
        mHeight = mNormal.getHeight();
        setMargin(0, 0, 0, 0);
        setPadding(0, 0, 0, 0);
        setBorder(BorderFactory.createSimpleBorder(new XYEdges(0, 0, 0, 0)));
        setBorder(VISUAL_STATE_ACTIVE, BorderFactory
                .createSimpleBorder(new XYEdges(0, 0, 0, 0)));
    }

    protected void paint(Graphics graphics) {
        Bitmap bitmap = null;
        switch (getVisualState()) {
        case VISUAL_STATE_NORMAL:
            bitmap = mNormal;
            break;
        case VISUAL_STATE_FOCUS:
            bitmap = mFocused;
            break;
        case VISUAL_STATE_ACTIVE:
            bitmap = mFocused;
            break;
        default:
            bitmap = mNormal;
        }
        graphics.drawBitmap(0, 0, bitmap.getWidth(), bitmap.getHeight(),
                bitmap, 0, 0);
    }

    public int getPreferredWidth() {
        return mWidth;
    }

    public int getPreferredHeight() {
        return mHeight;
    }

    protected void layout(int width, int height) {
        setExtent(mWidth, mHeight);
    }

    protected void applyTheme(Graphics arg0, boolean arg1) {

    }
}

这篇关于黑莓 - 字段布​​局动画的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！