1

画面の中央にテキスト ビューを配置し、多数のカスタム SeekBars を円形の端に配置したいと考えています。このように見えるはずです。

ビューの外観

ここに私がこれまでに持っているコードがあります。カスタム SeekBars の代わりに少ないコードを使用するために、デフォルトの SeekBars を使用します。Vertical Seek Bar ライブラリを利用していますhttps://github.com/AndroSelva/Vertical-SeekBar-Android

主な活動：

public class MainActivity extends Activity implements OnSeekBarChangeListener {

    TextView tv;
    TextView ss;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    RelativeLayout layout = (RelativeLayout) findViewById(R.id.main_layout);
    tv = (TextView)findViewById(R.id.seek_score);
    ss = (TextView)findViewById(R.id.selected_segment);


    RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(
    RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
    lp.addRule(RelativeLayout.RIGHT_OF, tv.getId());

    VerticalSeekBar verticalSeekBar = (VerticalSeekBar) getLayoutInflater().inflate(R.layout.motif_segment, null);
    verticalSeekBar.setName("Test Segment");
    verticalSeekBar.setOnSeekBarChangeListener(this);
    layout.addView(verticalSeekBar, lp);
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    // Inflate the menu; this adds items to the action bar if it is present.
    getMenuInflater().inflate(R.menu.main, menu);
    return false;
}

@Override
public void onProgressChanged(SeekBar seekBar, int progress, boolean isUser) {
    tv.setText(Integer.toString(progress / 100));
}

@Override
public void onStartTrackingTouch(SeekBar seekBar) {

}

@Override
public void onStopTrackingTouch(SeekBar seekBar) {


} 
}

main_activity.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity" 
    android:id="@+id/main_layout"
    android:layout_gravity="center"
> 

    <TextView 
       android:id="@+id/seek_score"
       android:layout_width="50dip"
       android:layout_height="50dip" 
       android:layout_centerHorizontal="true"
       android:background="@drawable/circle"
       android:gravity="center"
       android:text="0"
       android:layout_margin="40dip"
    />

    <TextView
        android:id="@+id/selected_segment"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:text="" />

</RelativeLayout>
4

1 に答える 1

1

画面の中央にテキスト ビューを配置し、多数のカスタム SeekBars を円形の端に配置したいと考えています。

番号付きのビューに任意の寸法があり (中央の円よりも大きいことを意味します)、画像のように配置したいだけの場合は、非常に簡単です:

  • 親を中心に、4 と 2 または 3 と 1 の間の距離を一辺とする正方形になる円ビューを作成します。
  • ビュー 1 は水平方向に中央に配置され、円ビューの上に設定されます
  • ビュー 3 は水平方向に中央に配置され、円ビューの下に設定されます
  • ビュー 4 は垂直方向に中央に配置され、円ビューの左側に設定されます
  • ビュー 2 は垂直方向に中央に配置され、円ビューの右側に設定されます

ビュー 1、2、3、4 を円のサイズにする場合は、上からの位置を使用しますが、円ビューで alignLeft/Right/top/Bottom プロパティも使用します。

これらの 4 つのビューが、円の周りに配置したい単一のビューではない場合、カスタムViewGroupを作成して、子ビューを配置する方法をより正確に計算する必要があります。

于 2013-03-16T17:18:07.703 に答える