我试图找出一种方法来围绕一个圆圈布置一系列视图,这样每个视图都被旋转为从圆圈向外。下面的图片是我正在寻找的粗略草图。外部块是布局/视图组,红色方块代表我要旋转的视图。
我熟悉 PivotX、PivotY 和 Rotation 视图属性,并怀疑我会以某种方式使用这些属性,但我不确定如何将这些与适当的布局结合使用以获得所需的效果。
这是一个执行此操作的示例。我创建了一个新的 Android 项目并将RelativeLayout
已经存在的项目替换为FrameLayout
. 它 >= API 11 只是因为 translate 和 rotate 调用View
:
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/main"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="@string/hello_world" />
</FrameLayout>
我将在代码中创建一些快速视图,只需将它们替换为您拥有的任何视图。我将它们全部放置在布局的中心,方法是将它们的重力设置LayoutParams
为Gravity.CENTER
. 然后,我将它们翻译并旋转到正确的位置:
@Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
final FrameLayout main = (FrameLayout)findViewById(R.id.main);
int numViews = 8;
for(int i = 0; i < numViews; i++)
{
// Create some quick TextViews that can be placed.
TextView v = new TextView(this);
// Set a text and center it in each view.
v.setText("View " + i);
v.setGravity(Gravity.CENTER);
v.setBackgroundColor(0xffff0000);
// Force the views to a nice size (150x100 px) that fits my display.
// This should of course be done in a display size independent way.
FrameLayout.LayoutParams lp = new FrameLayout.LayoutParams(150, 100);
// Place all views in the center of the layout. We'll transform them
// away from there in the code below.
lp.gravity = Gravity.CENTER;
// Set layout params on view.
v.setLayoutParams(lp);
// Calculate the angle of the current view. Adjust by 90 degrees to
// get View 0 at the top. We need the angle in degrees and radians.
float angleDeg = i * 360.0f / numViews - 90.0f;
float angleRad = (float)(angleDeg * Math.PI / 180.0f);
// Calculate the position of the view, offset from center (300 px from
// center). Again, this should be done in a display size independent way.
v.setTranslationX(300 * (float)Math.cos(angleRad));
v.setTranslationY(300 * (float)Math.sin(angleRad));
// Set the rotation of the view.
v.setRotation(angleDeg + 90.0f);
main.addView(v);
}
}
这是结果: