download this project import it.Color-picker
right click on project ---> property ---> android --->Add Click and add download project.
- Create new Project
layout Note : use the image of color picker from downloaded project res folder---> drawable
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MainActivity" > <EditText android:id="@+id/txNote" android:layout_width="200dip" android:layout_height="200dip" android:layout_centerInParent="true" android:text="@string/hello_world" /> <ImageView android:id="@+id/rightColorPicker" android:layout_width="@dimen/ambilwarna_hueWidth" android:layout_height="@dimen/ambilwarna_hsvHeight" android:layout_alignParentRight="true" android:layout_alignTop="@+id/txNote" android:scaleType="fitXY" android:src="@drawable/ambilwarna_hue" /> <ImageView android:id="@+id/leftColorPicker" android:layout_width="@dimen/ambilwarna_hueWidth" android:layout_height="@dimen/ambilwarna_hsvHeight" android:layout_alignParentLeft="true" android:layout_alignTop="@+id/txNote" android:scaleType="fitXY" android:src="@drawable/ambilwarna_hue" /> </RelativeLayout>
Activity
public class MainActivity extends Activity implements OnTouchListener { TextView txtNote; ImageView rightColorPicker,leftColorPicker; private int mAppWidgetId = 0 ; public static boolean flag; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); txtNote=(TextView)findViewById(R.id.txNote); rightColorPicker=(ImageView)findViewById(R.id.rightColorPicker); leftColorPicker=(ImageView)findViewById(R.id.leftColorPicker); rightColorPicker.setOnTouchListener(this); leftColorPicker.setOnTouchListener(this); Intent intent = getIntent(); Bundle extras = intent.getExtras(); if (extras != null) { mAppWidgetId = extras.getInt( AppWidgetManager.EXTRA_APPWIDGET_ID, AppWidgetManager.INVALID_APPWIDGET_ID); } } @Override public boolean onTouch(View v, MotionEvent event) { switch (v.getId()) { case R.id.rightColorPicker: colorPicker(); flag=true; break; case R.id.leftColorPicker: colorPicker(); flag=false; break; default: break; } return false; } public void colorPicker() { // initialColor is the initially-selected color to be shown in the rectangle on the left of the arrow. // for example, 0xff000000 is black, 0xff0000ff is blue. Please be aware of the initial 0xff which is the alpha. ColorPickerDialog dialog = new ColorPickerDialog(this, 0xff0000ff, new OnAmbilWarnaListener() { // Executes, when user click Cancel button @Override public void onCancel(ColorPickerDialog dialog){ } // Executes, when user click OK button @Override public void onOk(ColorPickerDialog dialog, int color) { // Create an Intent to launch WidgetConfigurationActivity screen Intent intent = new Intent(getBaseContext(), MainActivity.class); intent.putExtra(AppWidgetManager.EXTRA_APPWIDGET_ID, mAppWidgetId); // This is needed to make this intent different from its previous intents intent.setData(Uri.parse("tel:/"+ (int)System.currentTimeMillis())); // Creating a pending intent, which will be invoked when the user // clicks on the widget PendingIntent pendingIntent = PendingIntent.getActivity(getBaseContext(), 0, intent, PendingIntent.FLAG_UPDATE_CURRENT); // Getting an instance of WidgetManager AppWidgetManager appWidgetManager = AppWidgetManager.getInstance(getBaseContext()); if (flag) { txtNote.setBackgroundColor(color); } else { txtNote.setTextColor(color); } // // Instantiating the class RemoteViews with widget_layout RemoteViews views = new RemoteViews(getBaseContext().getPackageName(), R.layout.activity_main); // // // Setting the background color of the widget views.setInt(R.id.txNote, "setBackgroundColor", color); // // // Attach an on-click listener to the clock views.setOnClickPendingIntent(R.id.txNote,pendingIntent); // Tell the AppWidgetManager to perform an update on the app widget appWidgetManager.updateAppWidget(mAppWidgetId, views); // Return RESULT_OK from this activity Intent resultValue = new Intent(); resultValue.putExtra(AppWidgetManager.EXTRA_APPWIDGET_ID, mAppWidgetId); setResult(RESULT_OK, resultValue); //finish(); } }); dialog.show(); } }
Change text color and background color of textview using color picker in android
-
31-05-2022 - |
Question
How to change text color and background color of TextView
using color picker in android.
To Add note which have functionality to change color of text and background choosing color form the color picker.
Solution
OTHER TIPS
You can use the below for reference. It may not be exactly as snap shot posted in your question. You can use the below and modify it according to your requirements.
When you click the button color picker dialog pops up. You can select the color and click the center circle. The textview text color changes to the color choosen.
public class MainActivity extends Activity implements ColorPickerDialog.OnColorChangedListener {
Button b1;
TextView tv;
Paint mPaint;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mPaint = new Paint();
tv = (TextView) findViewById(R.id.tv);
b1 = (Button) findViewById(R.id.button1);
b1.setOnClickListener(new OnClickListener()
{
@Override
public void onClick(View v) {
// TODO Auto-generated method stub
new ColorPickerDialog(MainActivity.this, MainActivity.this, mPaint.getColor()).show();
}
});
}
@Override
public void colorChanged(int color) {
// TODO Auto-generated method stub
tv.setTextColor(color);
}
}
Color Picker
public class ColorPickerDialog extends Dialog {
public interface OnColorChangedListener {
void colorChanged(int color);
}
private OnColorChangedListener mListener;
private int mInitialColor;
private static class ColorPickerView extends View {
private Paint mPaint;
private Paint mCenterPaint;
private final int[] mColors;
private OnColorChangedListener mListener;
ColorPickerView(Context c, OnColorChangedListener l, int color) {
super(c);
mListener = l;
mColors = new int[] {
0xFFFF0000, 0xFFFF00FF, 0xFF0000FF, 0xFF00FFFF, 0xFF00FF00,
0xFFFFFF00, 0xFFFF0000
};
Shader s = new SweepGradient(0, 0, mColors, null);
mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
mPaint.setShader(s);
mPaint.setStyle(Paint.Style.STROKE);
mPaint.setStrokeWidth(32);
mCenterPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
mCenterPaint.setColor(color);
mCenterPaint.setStrokeWidth(5);
}
private boolean mTrackingCenter;
private boolean mHighlightCenter;
@Override
protected void onDraw(Canvas canvas) {
float r = CENTER_X - mPaint.getStrokeWidth()*0.5f;
canvas.translate(CENTER_X, CENTER_X);
canvas.drawOval(new RectF(-r, -r, r, r), mPaint);
canvas.drawCircle(0, 0, CENTER_RADIUS, mCenterPaint);
if (mTrackingCenter) {
int c = mCenterPaint.getColor();
mCenterPaint.setStyle(Paint.Style.STROKE);
if (mHighlightCenter) {
mCenterPaint.setAlpha(0xFF);
} else {
mCenterPaint.setAlpha(0x80);
}
canvas.drawCircle(0, 0,
CENTER_RADIUS + mCenterPaint.getStrokeWidth(),
mCenterPaint);
mCenterPaint.setStyle(Paint.Style.FILL);
mCenterPaint.setColor(c);
}
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
setMeasuredDimension(CENTER_X*2, CENTER_Y*2);
}
private static final int CENTER_X = 100;
private static final int CENTER_Y = 100;
private static final int CENTER_RADIUS = 32;
private int floatToByte(float x) {
int n = java.lang.Math.round(x);
return n;
}
private int pinToByte(int n) {
if (n < 0) {
n = 0;
} else if (n > 255) {
n = 255;
}
return n;
}
private int ave(int s, int d, float p) {
return s + java.lang.Math.round(p * (d - s));
}
private int interpColor(int colors[], float unit) {
if (unit <= 0) {
return colors[0];
}
if (unit >= 1) {
return colors[colors.length - 1];
}
float p = unit * (colors.length - 1);
int i = (int)p;
p -= i;
// now p is just the fractional part [0...1) and i is the index
int c0 = colors[i];
int c1 = colors[i+1];
int a = ave(Color.alpha(c0), Color.alpha(c1), p);
int r = ave(Color.red(c0), Color.red(c1), p);
int g = ave(Color.green(c0), Color.green(c1), p);
int b = ave(Color.blue(c0), Color.blue(c1), p);
return Color.argb(a, r, g, b);
}
private int rotateColor(int color, float rad) {
float deg = rad * 180 / 3.1415927f;
int r = Color.red(color);
int g = Color.green(color);
int b = Color.blue(color);
ColorMatrix cm = new ColorMatrix();
ColorMatrix tmp = new ColorMatrix();
cm.setRGB2YUV();
tmp.setRotate(0, deg);
cm.postConcat(tmp);
tmp.setYUV2RGB();
cm.postConcat(tmp);
final float[] a = cm.getArray();
int ir = floatToByte(a[0] * r + a[1] * g + a[2] * b);
int ig = floatToByte(a[5] * r + a[6] * g + a[7] * b);
int ib = floatToByte(a[10] * r + a[11] * g + a[12] * b);
return Color.argb(Color.alpha(color), pinToByte(ir),
pinToByte(ig), pinToByte(ib));
}
private static final float PI = 3.1415926f;
@Override
public boolean onTouchEvent(MotionEvent event) {
float x = event.getX() - CENTER_X;
float y = event.getY() - CENTER_Y;
boolean inCenter = java.lang.Math.sqrt(x*x + y*y) <= CENTER_RADIUS;
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
mTrackingCenter = inCenter;
if (inCenter) {
mHighlightCenter = true;
invalidate();
break;
}
case MotionEvent.ACTION_MOVE:
if (mTrackingCenter) {
if (mHighlightCenter != inCenter) {
mHighlightCenter = inCenter;
invalidate();
}
} else {
float angle = (float)java.lang.Math.atan2(y, x);
// need to turn angle [-PI ... PI] into unit [0....1]
float unit = angle/(2*PI);
if (unit < 0) {
unit += 1;
}
mCenterPaint.setColor(interpColor(mColors, unit));
invalidate();
}
break;
case MotionEvent.ACTION_UP:
if (mTrackingCenter) {
if (inCenter) {
mListener.colorChanged(mCenterPaint.getColor());
}
mTrackingCenter = false; // so we draw w/o halo
invalidate();
}
break;
}
return true;
}
}
public ColorPickerDialog(Context context,
OnColorChangedListener listener,
int initialColor) {
super(context);
mListener = listener;
mInitialColor = initialColor;
}
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
OnColorChangedListener l = new OnColorChangedListener() {
public void colorChanged(int color) {
mListener.colorChanged(color);
dismiss();
}
};
setContentView(new ColorPickerView(getContext(), l, mInitialColor));
setTitle("Pick a Color");
}
}
activity_main.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
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=".MainActivity" >
<Button
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:text="Button" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/tv"
android:layout_above="@+id/button1"
android:layout_alignRight="@+id/button1"
android:layout_marginBottom="180dp"
android:text="@string/hello_world" />
</RelativeLayout>
You can also use a color picker from https://code.google.com/p/android-color-picker/ activity
As is replied in this question: Android Color Picker there is an example of color picker. Using it you could change the color with:
Color colorPicket = Color.parse("color returned of color picket");
TextView textView = (TextView) v;
textView.setBackgroundColor(colorPicked); //if it returns in hex you can parse with COlor.par
textView.setTextColor(colorPicked);
Take a look: Color.parseColor
I don't know how you get your colors from the picker, so I suppose that you get it as a triplet of RGB colors/hexadecimal. Then you have to use the method setTextColor(int color)
There are many possibilities :
myTextView.setTextColor(Color.rgb(100,100,100)); //get color as a triplet RGB
myTextView.setTextColor(Color.parseColor("#FFFFFF")); //get color as hexadecimal String
To set the background of your textView
, use simply the method setBackgroundColor(int color)
(inherited from the View
class):
myTextView.setBackgroundColor(Color.rgb(100,100,100)); //example