以下のようなUIを開発する必要があります。
このタイプの画像を表示し、その画像にホットスポットを表示したいと思います。ホットスポットの位置は、元の画像に円が描かれる場合、x、y、および半径に従って動的になります。ユーザーはホットスポットをクリックでき、onclickアクションは、ユーザーがクリックする特定のホットスポットで定義されます。
このタイプのUIを開発するための最良のプロセスは何ですか?
以下のようなUIを開発する必要があります。
このタイプの画像を表示し、その画像にホットスポットを表示したいと思います。ホットスポットの位置は、元の画像に円が描かれる場合、x、y、および半径に従って動的になります。ユーザーはホットスポットをクリックでき、onclickアクションは、ユーザーがクリックする特定のホットスポットで定義されます。
このタイプのUIを開発するための最良のプロセスは何ですか?
メイン レイアウトを aにすると、次のコードを使用してプログラムで aをレイアウトRelativeLayout
に追加できます。ImageView
onClickListener
private void addImageView(RelativeLayout mainLayout, int x, int y, int width, int height, OnClickListener onClickListener){
ImageView imageView = new ImageView(this);
imageView.setAdjustViewBounds(false);
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
params.height = height;
params.width = width;
imageView.setLayoutParams(params);
imageView.setScaleType(ImageView.ScaleType.FIT_XY); //remove this if you want to keep aspect ratio
imageView.setImageDrawable(getResources().getDrawable(R.drawable.ic_launcher)); //here goes your drawable
params.leftMargin = x - width/2;
params.topMargin = y - height/2;
imageView.setOnClickListener(onClickListener);
mainLayout.addView(imageView);
}
それを使用するには、次のように呼び出します。
RelativeLayout mainLayout = (RelativeLayout) findViewById(R.id.relativeLayout); //this is your main layout
addImageButton(mainLayout, 200, 300, 200, 200, new OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(MainActivity.this, "clicked", Toast.LENGTH_SHORT).show();
}
});
ImageButton
aを使用して同じ目的を達成することもできますが、画像のサイズはボタンの境界線の影響を受けます。
private void addImageButton(RelativeLayout mainLayout, int x, int y, int width, int height, OnClickListener onClickListener){
ImageButton imageButton = new ImageButton(this);
imageButton.setAdjustViewBounds(true);
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
params.height = height;
params.width = width;
imageButton.setLayoutParams(params);
imageButton.setScaleType(ImageView.ScaleType.FIT_XY);
imageButton.setImageDrawable(getResources().getDrawable(R.drawable.ic_launcher));
params.leftMargin = x - width/2;
params.topMargin = y - height/2;
imageButton.setOnClickListener(onClickListener);
mainLayout.addView(imageButton);
}
それを試してみてください。