[英]How to make Custom View transparent in android
I am beginner in Android and I have a rather simple question. 我是Android的初学者,我有一个相当简单的问题。 I have created a custom view and then injected it into another layout through xml.
我创建了一个自定义视图,然后通过xml将其注入另一个布局。 I want to make the background of this custom view transparent.
我想让这个自定义视图的背景透明。
xml injection of my custom view: xml注入我的自定义视图:
<com.sagar.utils.ConnectDotsView
android:id="@+id/connect_dots_view"
android:layout_width="match_parent"
android:layout_height="match_parent" />
Here is the code of the custom View: 以下是自定义视图的代码:
public class ConnectDotsView extends View {
private Bitmap mBitmap;
private Canvas mCanvas;
private Path mPath;
private Paint mPaint;
private static final int TOUCH_TOLERANCE_DP = 24;
private static final int BACKGROUND = 0xFFDDDDDD;
// Points to be connected.
private List<Point> mPoints = new ArrayList<>();
private int mLastPointIndex = 0;
private int mTouchTolerance;
private boolean isPathStarted = false;
CompleteListener completeListener;
public ConnectDotsView(Context context) {
super(context);
mCanvas = new Canvas();
mPath = new Path();
initPaint();
}
public interface CompleteListener {
void onCompleteListener();
}
public void setOnCompleteListener(CompleteListener listener) {
completeListener = listener;
}
public ConnectDotsView(Context context, AttributeSet attrs) {
super(context, attrs);
mCanvas = new Canvas();
mPath = new Path();
initPaint();
}
public ConnectDotsView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
mCanvas = new Canvas();
mPath = new Path();
initPaint();
}
public void clear() {
mBitmap = Bitmap.createBitmap(getWidth(), getHeight(), Bitmap.Config.ARGB_8888);
mBitmap.eraseColor(BACKGROUND);
mCanvas.setBitmap(mBitmap);
invalidate();
}
@Override
protected void onSizeChanged(int width, int height, int oldWidth, int oldHeight) {
super.onSizeChanged(width, height, oldWidth, oldHeight);
clear();
}
@Override
protected void onDraw(Canvas canvas) {
canvas.drawColor(BACKGROUND);
canvas.drawBitmap(mBitmap, 0, 0, null);
canvas.drawPath(mPath, mPaint);
mPaint.setColor(Color.parseColor("#56CBF9"));
// TODO remove if you don't want points to be visible.
for (Point point : mPoints) {
canvas.drawPoint(point.x, point.y, mPaint);
mPaint.setColor(Color.BLACK);
}
}
@Override
public boolean onTouchEvent(MotionEvent event) {
float x = event.getX();
float y = event.getY();
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
touch_start(x, y);
invalidate();
break;
case MotionEvent.ACTION_MOVE:
touch_move(x, y);
invalidate();
break;
case MotionEvent.ACTION_UP:
touch_up(x, y);
invalidate();
break;
}
return true;
}
private void touch_start(float x, float y) {
if (checkPoint(x, y, mLastPointIndex)) {
mPath.reset();
// User starts from given point so path can be drawn.
isPathStarted = true;
} else {
// User starts move from point which does not belong to mPoints list
isPathStarted = false;
}
}
private void touch_move(float x, float y) {
if (isPathStarted) {
mPath.reset();
Point point = mPoints.get(mLastPointIndex);
mPath.moveTo(point.x, point.y);
if (checkPoint(x, y, mLastPointIndex + 1)) {
point = mPoints.get(mLastPointIndex + 1);
mPath.lineTo(point.x, point.y);
mCanvas.drawPath(mPath, mPaint);
mPath.reset();
++mLastPointIndex;
} else {
int positionIndex = mLastPointIndex + 1;
if (positionIndex >= mPoints.size()) {
completeListener.onCompleteListener();
} else {
mPath.lineTo(x, y);
}
}
}
}
private void touch_up(float x, float y) {
mPath.reset();
if (checkPoint(x, y, mLastPointIndex + 1) && isPathStarted) {
// Move finished at valid point so I draw whole line.
// That's the start point of current line segment.
Point point = mPoints.get(mLastPointIndex);
mPath.moveTo(point.x, point.y);
// And that's the end point.
point = mPoints.get(mLastPointIndex + 1);
mPath.lineTo(point.x, point.y);
mCanvas.drawPath(mPath, mPaint);
mPath.reset();
// Increment point index.
++mLastPointIndex;
isPathStarted = false;
}
}
/**
* Checks if user touch point with some tolerance
*/
private boolean checkPoint(float x, float y, int pointIndex) {
if (pointIndex >= mPoints.size()) {
// All dots already connected.
return false;
}
Point point = mPoints.get(pointIndex);
if (x > (point.x - mTouchTolerance) && x < (point.x + mTouchTolerance)) {
if (y > (point.y - mTouchTolerance) && y < (point.y + mTouchTolerance)) {
return true;
}
}
return false;
}
/**
* Sets up paint attributes.
*/
private void initPaint() {
mPaint = new Paint();
mPaint.setAntiAlias(true);
mPaint.setDither(true);
mPaint.setColor(Color.BLACK);
mPaint.setStyle(Paint.Style.STROKE);
mPaint.setStrokeJoin(Paint.Join.ROUND);
mPaint.setStrokeCap(Paint.Cap.ROUND);
mPaint.setStrokeWidth(12);
mTouchTolerance = dp2px(TOUCH_TOLERANCE_DP);
}
/**
* Converts dpi units to px
*
* @param dp
* @return
*/
private int dp2px(int dp) {
Resources r = getContext().getResources();
float px = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, dp, r.getDisplayMetrics());
return (int) px;
}
public void setPaint(Paint paint) {
this.mPaint = paint;
}
public Bitmap getBitmap() {
return mBitmap;
}
public List<Point> getPoints() {
return mPoints;
}
public void setPoints(List<Point> points) {
mLastPointIndex = 0;
this.mPoints = points;
}
}
I want to make the above custom View's background as transparent. 我想让上面的自定义View的背景透明。 How can I achieve that either through xml or code?
如何通过xml或代码实现这一目标?
Thanks in advance. 提前致谢。
使用view.setAlpha(float opacity)更改父视图的alpha,其中0f是完全透明视图。
In your Class ConnectDotsView change: 在您的类ConnectDotsView更改:
private static final int BACKGROUND = 0xFFDDDDDD;
to 至
private static final int BACKGROUND = Color.TRANSPARENT;
or 要么
private static final int BACKGROUND = Color.parseColor("#00000000");
#00AABBCC = ARGB ( 00 is Alpha, AA is red, BB is green and CC is blue), 00 alpha is 0% and FF is 100%.
#00AABBCC = ARGB ( 00为Alpha, AA为红色, BB为绿色, CC为蓝色),00 alpha为0%,FF为100%。 This mean #00AABBCC will be transparent, #80AABBCC will be at 50% transparent and #FFAABBCC not transparent
这意味着#00AABBCC将是透明的, #80AABBCC将是50%透明而#FFAABBCC是透明的
In your initPaint() method, call the following function: 在initPaint()方法中,调用以下函数:
setBackgroundColor(R.color.colorTransparent);
And in the values/colors.xml folder, set your colorTransparent with RGBA as 00: 在values / colors.xml文件夹中,将colorTransparent设置为RGBA为00:
<color name="colorTransparent">#00000000</color>
Alternatively, when you call your custom view in xml, use: android:background="#00000000". 或者,当您在xml中调用自定义视图时,请使用:android:background =“#00000000”。
This should solve your problem. 这应该可以解决您的问题。
Edited: 编辑:
just use setBackgroundColor(Color.TRANSPARENT);
只需使用
setBackgroundColor(Color.TRANSPARENT);
Or setBackgroundColor(0x00000000);
或者
setBackgroundColor(0x00000000);
50% opacity: setBackgroundColor(0x80000000);
50%不透明度:
setBackgroundColor(0x80000000);
To control the extent of transparency, use @Robillo's code, but modify this: 要控制透明度,请使用@ Robillo的代码,但要修改:
<color name="colorTransparent">#xy000000</color>
replace xy with your desired opacity. 用您想要的不透明度替换xy。 00 will be 0% opaque, FF is 100% opaque (ie white colour)
00将是0%不透明,FF是100%不透明(即白色)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.