具有背景颜色和透明文本的按钮 [英] Button with background color and transparent text
问题描述
我有一个带有一些背景图像的布局,并且上面有一个按钮.该按钮的背景色是白色.现在,我想在其上写一个文本,使该文本显示通过它的按钮后面的所有内容(例如透明文本).现在,很明显,如果我将文本颜色设置为透明,则该文本将消失,并且将看到一个没有文本的白色按钮.该怎么做?
I have a layout with some background image and have a button on it. The background color of the button is, say, white. Now I want to write a text on it in such a way that the text displays anything that is behind the button through it (like transparent text). Now, obviously, if I make the text color transparent, the text will disappear and I will be seeing a white button with no text. How to do this?
屏幕截图:
推荐答案
两种方法:(1)并非精确的解决方案,因为文本对齐方式应由人工编码,但是:
Two ways: (1) not precise solution as text alignment should be coded by hands but:
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Button view1 = new Button(this);
RelativeLayout layout1 = (RelativeLayout) findViewById(R.id.layout1);
layout1.setBackground(getResources().getDrawable(R.drawable.choose_background));
layout1.addView(view1);
Bitmap mainImage = Bitmap.createBitmap(500, 500, Bitmap.Config.ARGB_8888);
{
//creating image is not necessary, more important is ability to grab the bitmap.
Canvas canvas = new Canvas(mainImage);
canvas.drawColor(Color.WHITE);
view1.setBackground(new BitmapDrawable(getResources(), mainImage));
}
{
Canvas canvas = new Canvas(mainImage);
//most interesting part:
Paint eraserPaint = new Paint();
eraserPaint.setAlpha(0); //this
eraserPaint.setTextSize(200);
eraserPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_IN)); //and this
canvas.drawText("some", 10, 150, eraserPaint);
}
}
"erasePaint"的想法是从此处使用PorterDuff模式擦除位图部分在这里 Android如何在ImageView上应用蒙版?
the idea of eraserPaint is from here Erase bitmap parts using PorterDuff mode and here Android how to apply mask on ImageView?
activity_main.xml中的所有内容均为默认值:
in activity_main.xml everything is default:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/layout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
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="com.runup.myapplication2.app.MainActivity">
结果是:
(2)第二种方法是将此行为添加到类中,以便在xml中使用它. https://github.com/togramago/ClearTextViewProject -带有示例的图书馆项目.您可以将其添加为库,也可以仅将ClearTextView类复制到您的项目中(因为它是不带xml资源的扩展TextView).适用于配置更改以及动态文本和/或背景更改.
(2) Second way is to add this behavior to class in order to use it in xml. https://github.com/togramago/ClearTextViewProject - library project with a sample. You may add as a library or copy only ClearTextView class to your project (as it is an extended TextView without xml resources). works on configuration change and dynamical text and/or background changes.
以纵向为单位的示例结果:
The result of the sample in portrait:
以及横向:
这篇关于具有背景颜色和透明文本的按钮的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!