5 图像组件(Image)的定制
App Inventor2提供的图像组件只支持左右滑动的动画形式,如下所示:
现修改代码使其也支持上下滑动的动画形式。
图像组件的源码为Image.java,其中有如下代码:
/**
*Animation property setter method.
*
* @seeAnimationUtil
*
* @paramanimation animation kind
*/
@SimpleProperty(description= "This is a limited form of animation that can attach " +
"a small number of motion types to images. The allowable motions are " +
"ScrollRightSlow, ScrollRight, ScrollRightFast, ScrollLeftSlow,ScrollLeft, " +
"ScrollLeftFast, and Stop",
category = PropertyCategory.APPEARANCE)
//TODO(user): This should be changed from a property to an "animate"method, and have the choices
//placed in a dropdown. Aternatively thewhole thing should be removed and we should do
//something that is more consistent with sprites.
publicvoid Animation(String animation) {
AnimationUtil.ApplyAnimation(view,animation);
}
可以看到其实是调用AnimationUtil.ApplyAnimation函数实现动画,其中只有让图片左右滑动的代码:
/**
*Animates a component (using pre-defined animation kinds).
*
* @paramview component to animate
* @paramanimation animation kind
*/
publicstatic void ApplyAnimation(View view, String animation) {
//TODO(user): These string constants need to be extracted and defined somewhereelse!
//TODO(user): Also, the endless else-if is inefficient
if (animation.equals("ScrollRightSlow")){
ApplyHorizontalScrollAnimation(view, false, 8000);
}else if (animation.equals("ScrollRight")) {
ApplyHorizontalScrollAnimation(view, false, 4000);
}else if (animation.equals("ScrollRightFast")) {
ApplyHorizontalScrollAnimation(view, false, 1000);
}else if (animation.equals("ScrollLeftSlow")) {
ApplyHorizontalScrollAnimation(view, true, 8000);
}else if (animation.equals("ScrollLeft")) {
ApplyHorizontalScrollAnimation(view, true, 4000);
}else if (animation.equals("ScrollLeftFast")) {
ApplyHorizontalScrollAnimation(view, true, 1000);
}else if (animation.equals("Stop")) {
view.clearAnimation();
}
}
/*
*Animates a component moving it horizontally.
*/
privatestatic void ApplyHorizontalScrollAnimation(View view, boolean left, int speed){
floatsign = left ? 1f : -1f;
AnimationSetanimationSet = new AnimationSet(true);
animationSet.setRepeatCount(Animation.INFINITE);
animationSet.setRepeatMode(Animation.RESTART);
TranslateAnimationmove = new TranslateAnimation(Animation.RELATIVE_TO_PARENT, sign * 0.70f,
Animation.RELATIVE_TO_PARENT, sign * -0.70f, Animation.RELATIVE_TO_PARENT,0,
Animation.RELATIVE_TO_PARENT, 0);
move.setStartOffset(0);
move.setDuration(speed);
move.setFillAfter(true);
animationSet.addAnimation(move);
view.startAnimation(animationSet);
}
参照源码添加让图片上下滑动的代码,首先修改Image.java中动画形式属性的说明文字,改为如下:
description = "设置图片左右或上下滑动,及停止滑动,可设置的值为: " +
"ScrollRightSlow、ScrollRight、ScrollRightFast、ScrollLeftSlow、ScrollLeft、 " +
"ScrollLeftFast、ScrollDownSlow、ScrollDown、ScrollDownFast、ScrollUpSlow、ScrollUp、ScrollUpFast和Stop",
然后在AnimationUtil.java中添加让图片上下滑动的代码:
/**
*Animates a component (using pre-defined animation kinds).
*
* @paramview component to animate
* @paramanimation animation kind
*/
public static void ApplyAnimation(View view, Stringanimation) {
//TODO(user): These string constants need to be extracted and defined somewhereelse!
//TODO(user): Also, the endless else-if is inefficient
if(animation.equals("ScrollRightSlow")) {
ApplyHorizontalScrollAnimation(view, false, 8000);
}else if (animation.equals("ScrollRight")) {
ApplyHorizontalScrollAnimation(view, false, 4000);
}else if (animation.equals("ScrollRightFast")) {
ApplyHorizontalScrollAnimation(view, false, 1000);
}else if (animation.equals("ScrollLeftSlow")) {
ApplyHorizontalScrollAnimation(view, true, 8000);
}else if (animation.equals("ScrollLeft")) {
ApplyHorizontalScrollAnimation(view, true, 4000);
} else if (animation.equals("ScrollLeftFast")){
ApplyHorizontalScrollAnimation(view, true, 1000);
}else if (animation.equals("ScrollDownSlow")) {
ApplyVerticalScrollAnimation(view, false, 8000);
}else if (animation.equals("ScrollDown")) {
ApplyVerticalScrollAnimation(view, false, 4000);
} elseif (animation.equals("ScrollDownFast")) {
ApplyVerticalScrollAnimation(view, false, 1000);
}else if (animation.equals("ScrollUpSlow")) {
ApplyVerticalScrollAnimation(view, true, 8000);
}else if (animation.equals("ScrollUp")) {
ApplyVerticalScrollAnimation(view, true, 4000);
}else if (animation.equals("ScrollUpFast")) {
ApplyVerticalScrollAnimation(view, true, 1000);
}else if (animation.equals("Stop")) {
view.clearAnimation();
}
}
/*
*Animates a component moving it horizontally.
*/
privatestatic void ApplyVerticalScrollAnimation(View view, boolean up, int speed) {
AnimationSetanimationSet = new AnimationSet(true);
animationSet.setRepeatCount(Animation.INFINITE);
animationSet.setRepeatMode(Animation.RESTART);
TranslateAnimationmove;
if(up){
move = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0.0f,
Animation.RELATIVE_TO_SELF, 0.0f,Animation.RELATIVE_TO_SELF,
1.0f, Animation.RELATIVE_TO_SELF,0.0f);
}else{
move = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0.0f,
Animation.RELATIVE_TO_SELF, 0.0f,Animation.RELATIVE_TO_SELF,
0.0f, Animation.RELATIVE_TO_SELF,1.0f);
}
使用示例: