Scale Animation with only one letter?

Question

in my activity is one word "Ecl pse" and a button. After I click on the button I want the letter "i" to appear big and then getting smaller until it is as big as the the other letters of the word Ecl pse. Momentarily the whole word Eclipse is influenced by the scale Animation. So after I clicked on the button the whole word Eclipse appears bigger and getting smaller. But I only want the letter "i" scale animated. How does that work?

public Button btn;
public TextView tw;
Animation a;

@Override
protected void onCreate(Bundle savedInstanceState) {
    // TODO Auto-generated method stub
    super.onCreate(savedInstanceState);
    setContentView(R.layout.pagetwo);



    btn = (Button) findViewById(R.id.BtnKlick);
    tw = (TextView) findViewById(R.id.tvhallo);
    a= AnimationUtils.loadAnimation(this, R.anim.scale);

    btn.setOnClickListener(this);

    SpannableString text = new SpannableString("Ecl pse");  

}



@Override
public void onClick(View v) {
    // TODO Auto-generated method stub

    String text = tw.getText().toString();
    int n = 3; 
    String newText = text.substring(0, n) + "i" + text.substring(n + 1);

    tw.setText(newText);
    tw.startAnimation(a);

Answer 1

You can achieve this by combining Spannable (text with markup) with a ValueAnimator to update the relative size of the part you want over time. For example:

ValueAnimator animator = new ValueAnimator();
animator.setDuration(4000);
animator.setObjectValues("Ecl pse", "Eclipse");

animator.setEvaluator(new TypeEvaluator<CharSequence>()
{
    @Override
    public CharSequence evaluate(float fraction, CharSequence startValue, CharSequence endValue)
    {
        float relativeSize = 4 - 3 * fraction;
        Spannable span = new SpannableString("Eclipse");
        span.setSpan(new RelativeSizeSpan(relativeSize), 3, 4, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
        return span;
    }
});

animator.addUpdateListener(new AnimatorUpdateListener()
{
    @Override
    public void onAnimationUpdate(ValueAnimator animation)
    {
        textView.setText((CharSequence)animation.getAnimatedValue());
    }
});

animator.start();

This will show an "i" 4 times as large as the surrounding text, then make it smaller until it's the same size as the rest. You can customize duration, interpolator, &c to achieve the effect you want.