在Android中倾斜文本视图

Question

我希望在我的应用程序中复制以下内容：

正如您所见，它基本上是一个按钮，可以增加/减少其中包含的文本视图的值。该按钮将具有三个视觉状态 -> 未按下，减小和增大（如上图所示，用户点击增加箭头，按钮在该侧看起来被按下）

目前这里有我设计的3种按钮状态：

如您所见，我遇到的问题是能否正确地倾斜/旋转文本视图，以便在增加或减少按钮时它看起来视觉上正确并呈现倾斜状态。

到目前为止，我尝试了两种不同的方法：

• Create a custom text view class which overrides the onDraw() method to skew the canvas:

  @Override
  public void onDraw(Canvas canvas) { 
     canvas.save(); 
  
     canvas.skew(0.2f, 0f);
  
     super.onDraw(canvas); 
     canvas.restore();
  }
  

• Integrate the Rotate3dAnimation class (source here) and used many different variations to get the desired result such as:

     Rotate3dAnimation skew = new Rotate3dAnimation(
            30, 0, centerX, centerY, 0, false);
     txtAmount.startAnimation(skew); 
  

很遗憾，我没有得到与上面第一张图片完全相同的结果。我对设置Z轴、倾斜、旋转等数值感到困惑。

非常感谢任何有经验的人提供帮助。提前致谢。

- elgoog

Answer 1

我甚至尝试了一下，得到了如下结果：

 public class DemoActivity extends TextView {
    Context context;
    String firstText = "$120.00";

 public DemoActivity(Context context)
   {
    super(context);
    this.context = context;

   }


    @Override
    protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    setText(firstText);
    setTextSize(30);
    canvas.skew(1.0f, 0.3f);  //you need to change values over here
    Rotate3dAnimation skew = new Rotate3dAnimation(
              -20, 30,200, 200, 0, false);   //here too
    startAnimation(skew);

        }
    }

我得到了以下的输出: 我猜通过试错改变数值可以解决你的问题。希望能对你有所帮助。

- Parth Doshi

---

嗨，Parth，感谢你的回答。通过结合这两种方法并像你所说的那样稍微改变一下值，我对最终结果感到满意。我想我最终也会得到这个答案，但是你的回答加快了这个过程 :) - elgoog

这只是一个不好的命名选择@JamesGoodwin，但它运行得很好！ - Mars

@elgoog 我正在使用相同的代码，我想知道200的值对应什么？它是旋转中心吗？还是某种轴？ - akari

在onDraw中不应使用setText和setTextSize！此外（正如James Goodwin所写），您不应将TextView命名为Activity... - joe1806772

Answer 2

感谢Parth Doshi的回答。他的回答需要一些调整才能运行，我在这里分享一下，以节省其他人的时间。

首先，在src文件夹中创建一个类，并编写所有三个构造函数。

public class TextViewDemo extends TextView {

Context context;
String text = "TESTING 3DX TOOLS";

public TextViewDemo(Context context) {
    super(context);
    this.context = context;
}

public TextViewDemo(Context context, AttributeSet attrs) {
    super(context, attrs);
    this.context = context;
}

public TextViewDemo(Context context, AttributeSet attrs, int defStyle) {
    super(context, attrs, defStyle);
    this.context = context;
}

@Override
protected void onDraw(Canvas canvas) {
    // TODO Auto-generated method stub
    super.onDraw(canvas);
    setText(text);
    setTextSize(30);
    canvas.skew(0.5f, 1.0f); // you need to change values over here
    Rotate3dAnimation skew = new Rotate3dAnimation(-50, 30, 0, 0, 0,
            false); // here too
    startAnimation(skew);

}

}

在你的res/layout/my_layout.xml文件中，你可以添加一个自定义TextView的标签。

<com.yourpackage.name.TextViewDemo
    android:id="@+id/name"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    android:text="Hello World"
<!-- All parameters and value shall remain same -->
/>

像其他视图一样，您可以在onCreate()方法中创建TextViewDemo的实例。

TextViewDemo txtDemo = (TextViewDemo) findViewById(R.id.name);

敬礼

- Bilal Rabbani