Using onDraw, I want to make a custom text view that changes color depending on its text value. For example, if the text value is "hello" I want it to be red and if it says "bye" I want it to be green. Any helps greatly appreciated.
I'm not necessarily sure why you want to do this in onDraw(). Unless you have a really good reason to set up a custom TextView/EditText, that's not necessary.
To simplify your situation, you can implement a TextWatcher to do this, and in onTextChanged(), you can set the color by comparing the string values using .equals().
Here is an example of your theoretical situation:
final EditText yourEditText = /* findViewById maybe? */;
yourEditText.addTextChangedListener(new TextWatcher() {
public void onTextChanged(CharSequence s, int start, int before, int count) {
if (s.equalsIgnoreCase("hello"))
yourEditText.setTextColor(Color.RED);
else if (s.equalsIgnoreCase("bye"))
yourEditText.setTextColor(Color.GREEN);
else // if it says neither "hello" nor "bye"
yourEditText.setTextColor(Color.BLACK);
}
public void beforeTextChanged(CharSequence s, int start, int count, int after) {
// Nothing needs to happen here
}
public void afterTextChanged(Editable s) {
// Nothing needs to happen here
}
});
If you feel its necessary to maintain this in onDraw(), simply extract the code from onTextChanged() and change yourEditText to this, or place it in the constructor instead:
public class YourTextView extends TextView { // Or extends EditText, doesn't matter
public YourTextView(Context context) {
this(context, null, 0);
}
public YourTextView(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public YourTextView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
addTextChangedListener(new TextWatcher() {
// Copy the TextWatcher code from the example above, replacing "yourEditText" with "YourTextView.this"
});
}
// ... Rest of your class
}
I figured out how to do it in a more creative way using onDraw.
public class MagnitudeTextView extends TextView {
public MagnitudeTextView(Context context) {
super(context);
// TODO Auto-generated constructor stub
}
public MagnitudeTextView(Context context, AttributeSet attrs) {
super(context, attrs);
// TODO Auto-generated constructor stub
}
public MagnitudeTextView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
// TODO Auto-generated constructor stub
}
/*
* (non-Javadoc)
*
* #see android.widget.TextView#onDraw(android.graphics.Canvas)
*/
#Override
protected void onDraw(Canvas canvas) {
int height = getMeasuredHeight();
int width = getMeasuredWidth();
int px = width / 2;
int py = height / 2;
Paint Red = new Paint(Paint.ANTI_ALIAS_FLAG);
Red.setColor(Color.RED);
Paint White = new Paint(Paint.ANTI_ALIAS_FLAG);
White.setColor(Color.DKGRAY);
Paint Yellow = new Paint(Paint.ANTI_ALIAS_FLAG);
Yellow.setARGB(210, 105, 30, 0);
Paint Blue = new Paint(Paint.ANTI_ALIAS_FLAG);
Blue.setColor(Color.BLUE);
float textWidth = Red.measureText(String.valueOf(getText()));
String g = String.valueOf(getText());
if (g.startsWith("3") || g.startsWith("4")) {
canvas.drawText(String.valueOf(getText()), px - textWidth / 2, py,
White);
}
if (g.startsWith("6") || g.startsWith("5") || g.startsWith("7")
|| g.startsWith("8")) {
canvas.drawText(String.valueOf(getText()), px - textWidth / 2, py,
Yellow);
}
if (g.startsWith("9") || g.startsWith("10")) {
canvas.drawText(String.valueOf(getText()), px - textWidth / 2, py,
Red);
}
// super.onDraw(canvas);
}
}
You can overwrite setText() and set the color using setTextColor().
You can do it inside onDraw as well, but it's not worth the weigth, as it may pass many times inside onDraw.
You can implement TextWatcher and use onTextChanged()
More about it here in the Android Docs
Use this to get the text:
TextView text = (TextView)findViewById(R.id.textid);
String value = text.getText().toString();
Then check what the text is and change the color :
if (value.equals("hello")) {
text.setBackgroundColor(yourcolor);
}
Related
I know I'm not the first one having issue with a VerticalSlider on android but even though I recall struggling to make it work in the first place this is the first time that I have a partially working setProgress().
So here is the thing.
The blue line that represents the slider is properly updated but the tiny "button" that is supposed to moved as well does not move at all. (see images)
The blue line is moving according to to the values I send, but the "button" is not. It is moving a little, but not at all following the blue line---which is right. (If you have better terms for "button" and blue-line, feel free to edit. Progress line maybe?)
So this is the code I have for the vertical slider:
import android.content.Context;
import android.graphics.Canvas;
import android.util.AttributeSet;
import android.util.Log;
import android.view.MotionEvent;
import android.widget.SeekBar;
public class VerticalSeekBar extends SeekBar {
public VerticalSeekBar(Context context) {
super(context);
}
public VerticalSeekBar(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
public VerticalSeekBar(Context context, AttributeSet attrs) {
super(context, attrs);
}
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(h, w, oldh, oldw);
}
#Override
protected synchronized void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(heightMeasureSpec, widthMeasureSpec);
setMeasuredDimension(getMeasuredHeight(), getMeasuredWidth());
}
protected void onDraw(Canvas canvas) {
canvas.rotate(-90);
canvas.translate(-getHeight(), 0);
super.onDraw(canvas);
}
#Override
public boolean onTouchEvent(MotionEvent event) {
if (!isEnabled())
return false;
boolean result = false;
if (event.getAction() != MotionEvent.ACTION_MOVE) {
// Prevent duplicate haptic feedback events (due to
// setProgress() below)
boolean hf = isHapticFeedbackEnabled();
setHapticFeedbackEnabled(false); {
// This is required for OnSeekBarChangeListener.on{Start,Stop}TrackingTouch()
result = super.onTouchEvent(event);
} setHapticFeedbackEnabled(hf);
}
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
case MotionEvent.ACTION_UP:
case MotionEvent.ACTION_MOVE:
// Vertical scrolling
setProgress(getMax() - (int)(getMax() * event.getY()/getHeight()));
onSizeChanged(getWidth(), getHeight(), 0, 0);
result = true;
break;
}
return result;
}
public void customSetProgress(int progress) {
setProgress(progress);
onSizeChanged(getWidth(), getHeight(), 0, 0);
}
}
And this how I'm updating the slider:
float value = //... Get the value here from other computations
// We need to use int for the slider
final int step = 1;
final int max = (int)MAXPRECISION * 100;
final int min = (int)MINPRECISION * 100;
final double initialPosition = (double)max ;
final int valueInt = (int) (value * 100) ;
final VerticalSeekBar sliderPrecision = (VerticalSeekBar)findViewById(R.id.verticalSliderPrecision);
sliderPrecision.setProgress(valueInt);
sliderPrecision.setMax( (max - min) / step ); //To make sure it is updated as seen in some SO post.
I am pretty confident that my VerticalSlider class is good as I have been able to use it properly years ago. So there is surely something wrong with the rest of the code, but I can't find what that may be.
As for the images here they are:
So I found out that this is solved by calling onSizeChanged(getWidth(), getHeight(), 0, 0);
So I have created an updated VerticalSeekBar that works just fine now.
I do hope it will help other people struggling with them.
Here is the updated class:
import android.content.Context;
import android.graphics.Canvas;
import android.util.AttributeSet;
import android.util.Log;
import android.view.MotionEvent;
import android.widget.SeekBar;
public class VerticalSeekBar extends SeekBar {
public VerticalSeekBar(Context context) {
super(context);
}
public VerticalSeekBar(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
public VerticalSeekBar(Context context, AttributeSet attrs) {
super(context, attrs);
}
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(h, w, oldh, oldw);
}
#Override
protected synchronized void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(heightMeasureSpec, widthMeasureSpec);
setMeasuredDimension(getMeasuredHeight(), getMeasuredWidth());
}
protected void onDraw(Canvas canvas) {
canvas.rotate(-90);
canvas.translate(-getHeight(), 0);
super.onDraw(canvas);
}
#Override
public boolean onTouchEvent(MotionEvent event) {
if (!isEnabled())
return false;
boolean result = false;
if (event.getAction() != MotionEvent.ACTION_MOVE) {
// Prevent duplicate haptic feedback events (due to
// setProgress() below)
boolean hf = isHapticFeedbackEnabled();
setHapticFeedbackEnabled(false); {
// This is required for OnSeekBarChangeListener.on{Start,Stop}TrackingTouch()
result = super.onTouchEvent(event);
} setHapticFeedbackEnabled(hf);
}
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
case MotionEvent.ACTION_UP:
case MotionEvent.ACTION_MOVE:
// Vertical scrolling
setProgress(getMax() - (int)(getMax() * event.getY()/getHeight()));
onSizeChanged(getWidth(), getHeight(), 0, 0);
result = true;
break;
}
return result;
}
public void customSetProgress(int progress) {
setProgress(progress);
onSizeChanged(getWidth(), getHeight(), 0, 0);
}
}
Hi I drew a bitmap on the canvas and I wanted to do something when the user touches it.
Bitmap backbutton = BitmapFactory.decodeResource(getResources(),
R.drawable.backbutton);
Paint paint = new Paint();
canvas.drawBitmap(backbutton, canvasWidth - 100, 0, paint);
I have tried the following to solve the problem but it isnt working. How do I check for inbounds properly?
public void onTouch(View view, MotionEvent event) {
if(backbutton.contains((int) (event.getX()), (int)(event.getY()), (int)(event.getX()+100),(int) (event.getY()+30))) {
Toast.makeText(view.getContext(), "this works", Toast.LENGTH_LONG).show();
}
}
But I seem to be doing something wrong with the contains(). Can someone help me out here please?
First get the rect of the bitmap on the canvas. then in the onTouchEvent, check the touched x, y is contained in the rect before.
Added Example:
public class MyView extends View {
Rect bitmapRect;
public MyView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
public MyView(Context context, AttributeSet attrs) {
super(context, attrs);
}
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas); //To change body of overridden methods use File | Settings | File Templates.
Bitmap bitmap = BitmapFactory.decodeResource(getResources(),R.drawable.ic_launcher);
Rect source = new Rect(0,0,bitmap.getWidth(), bitmap.getHeight());
bitmapRect = new Rect(0,0, bitmap.getWidth(), bitmap.getHeight());
canvas.drawBitmap(bitmap, source, bitmapRect, new Paint());
}
#Override
public boolean onTouchEvent(MotionEvent event) {
int x = (int)event.getX();
int y = (int)event.getY();
if(null != bitmapRect && bitmapRect.contains(x,y)){
Toast.makeText(view.getContext(), "this works", Toast.LENGTH_LONG).show();
}
return super.onTouchEvent(event); //To change body of overridden methods use File | Settings | File Templates.
}
}
I want to implement a custom RatingBar in my workout app. The bar should have 4 stars and a stepsize of 1. The layout looks like this:
<com.example.workouttest.MyBar
android:id="#+id/rating"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:max="4"
android:numStars="4"
android:stepSize="1"
android:scaleX="0.6"
android:scaleY="0.6"
android:layout_gravity="right" />
I want to replace the default stars with custom images. But each of the 4 stars should have a different image:
Star 1 = an "X" that means "this item is disabled"
Star 2 = Thumb down
Star 3 = something that represents a "neutral rating"
Star 4 = Thumb up
Addtitionally when, for example, the item is rated with a 3 (neutral rating), all other stars (1,2 and 4) should display a greyed out version of their image.
I tried to extend from RatingBar and came up with the following code:
public class MyBar extends RatingBar {
private int[] starArrayColor = {
R.drawable.star_1_color,
R.drawable.star_2_color,
R.drawable.star_3_color,
R.drawable.star_4_color
};
private int[] starArrayGrey = {
R.drawable.star_1_grey,
R.drawable.star_2_grey,
R.drawable.star_3_grey,
R.drawable.star_4_grey
};
public MyBar(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
public MyBar(Context context, AttributeSet attrs) {
super(context, attrs);
}
public MyBar(Context context) {
super(context);
}
#Override
protected synchronized void onDraw(Canvas canvas) {
int stars = getNumStars();
float rating = getRating();
for (int i=0;i<stars;i++) {
Bitmap bitmap;
Resources res = getResources();
Paint paint = new Paint();
if ((int) rating == i) {
bitmap = BitmapFactory.decodeResource(res, starArrayColor[i]);
} else {
bitmap = BitmapFactory.decodeResource(res, starArrayGrey[i]);
}
canvas.drawBitmap(bitmap, 0, 0, paint);
canvas.save();
}
super.onDraw(canvas);
}
}
Sadly it did not work. It draws just the normal stars with my custom images as background.
Is here someone who knows how to help me solve this problem?
UPDATE
Thanks to Gabe my working onDraw method now looks like this:
#Override
protected synchronized void onDraw(Canvas canvas) {
int stars = getNumStars();
float rating = getRating();
float x = 0;
for (int i=0;i<stars;i++) {
Bitmap bitmap;
Resources res = getResources();
Paint paint = new Paint();
x += 50;
if ((int) rating-1 == i) {
bitmap = BitmapFactory.decodeResource(res, starArrayColor[i]);
} else {
bitmap = BitmapFactory.decodeResource(res, starArrayGrey[i]);
}
Bitmap scaled = Bitmap.createScaledBitmap(bitmap, 48, 48, true);
canvas.drawBitmap(scaled, x, 0, paint);
canvas.save();
}
}
Don't call super.onDraw- that will draw the normal stars. From there, what else doesn't work?
I am working on application in which i want to display different text on image.when i touch the different position.I am working on the different image.In my program I have used one class to change the image and one class to draw a text on the image.
my activity class is as follow......
public class VideosActivity extends Activity implements OnTouchListener
{
//DrawView draw;
float a=0;
float b=0;
ImageView image;
MotionEvent event;
Button back ;
Button next;
TextView t;
String info = "";
int count =0;
FirstImage i;
ViewFlipper c;
Infoview v;
String huma="human";
#Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.videos_layout);
i=new FirstImage(this);
c=(ViewFlipper) findViewById(R.id.viewFlipper1);
back = (Button) findViewById(R.id.button1);
next = (Button) findViewById(R.id.button2);
t=(TextView) findViewById(R.id.textView1);
if(count==0)
i.changeImage(R.drawable.human );
i.invalidate();
c.addView(i,0);
c.setOnTouchListener(this);
c.onTouchEvent(event);
}
public void pageinfo(float a,float b)
{
t.setText(Float.toString(a)+"x"+Float.toString(b)+"y");
i.display( a, b);
}
public boolean onTouch(View v, MotionEvent me)
{
// TODO Auto-generated method stub
switch(me.getAction())
{
case MotionEvent.ACTION_DOWN:
a=me.getX();
b= me.getY();
pageinfo(a,b);
break;
case MotionEvent.ACTION_MOVE:
a=me.getX();
b= me.getY();
pageinfo(a,b);
break;
case MotionEvent.ACTION_UP:
a=me.getX();
b= me.getY();
pageinfo(a,b);
break;
case MotionEvent.ACTION_OUTSIDE:
a=me.getX();
b= me.getY();
pageinfo(a,b);
break;
default: return false;
}
return true;
}
}
the class which is used to change the image is as follow...
public class FirstImage extends LinearLayout {
ImageView i;
int x;
Infoview v;
String huma ="human";
public FirstImage(Context context) {
super(context);
v=new Infoview(context);
i= new ImageView (context);
LinearLayout.LayoutParams lp = new LinearLayout.LayoutParams(android.view.ViewGroup.LayoutParams.WRAP_CONTENT, android.view.ViewGroup.LayoutParams.WRAP_CONTENT);
addView(i, lp);
addView(v,lp);
}
public FirstImage(Context context, AttributeSet attrs) {
super(context, attrs);
}
protected void changeImage(int id){
i.setImageResource(id);
x=id;
}
public int getSrc() {
// TODO Auto-generated method stub
return x;
}
public void display(float a, float b) {
// TODO Auto-generated method stub
if(i.getId()==R.drawable.human){
v.updateInfo(huma, a, b);
i.invalidate();
v.invalidate();
}
}
}
class which is used for drawing text on the image is as follow..
public class Infoview extends View {
String info = "";
float x = 0; //init value
float y = 0; //init value
int color = Color.WHITE;
public Infoview(Context context) {
super(context);
// TODO Auto-generated constructor stub
}
public Infoview(Context context, AttributeSet attrs) {
super(context, attrs);
// TODO Auto-generated constructor stub
}
public Infoview(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
// TODO Auto-generated constructor stub
}
#Override
protected void onDraw(Canvas canvas) {
// TODO Auto-generated method stub
super.onDraw(canvas);
Paint paint = new Paint();
paint.setStyle(Paint.Style.FILL_AND_STROKE);
paint.setColor(color);
paint.setStrokeWidth(2);
paint.setTextSize(30);
canvas.drawLine(x-10, y, x+10, y, paint);
canvas.drawLine(x, y-10, x, y+10, paint);
canvas.drawText(info, x, y, paint);
}
public void updateInfo(String t_info, float t_x, float t_y){
info = t_info;
x = t_x;
y = t_y;
invalidate();
}
public void clearInfo(){
info = "";
x = 0;
y = 0;
invalidate();
}
I am not understanding why it is not displaying text on the image ......I think in the time of image drawing i am using one layout.so i have to include drawing class(Infoview) into that layout to...
If any one thinking that i am re asking this question then i am sorry ...
any help is appreciated...
I did get time to read the full code but if you override onDraw, you are not supposed to invoke super.onDraw() inside that method since that will mean that the base class will draw everything first.
How to create a bounce ScrollView in Android like iPhone?
Add effect bounce to scrollview in android
Step 1: Create new file BounceScrollView in package com.base.view
public class BounceScrollView extends ScrollView
{
private static final int MAX_Y_OVERSCROLL_DISTANCE = 200;
private Context mContext;
private int mMaxYOverscrollDistance;
public BounceScrollView(Context context)
{
super(context);
mContext = context;
initBounceScrollView();
}
public BounceScrollView(Context context, AttributeSet attrs)
{
super(context, attrs);
mContext = context;
initBounceScrollView();
}
public BounceScrollView(Context context, AttributeSet attrs, int defStyle)
{
super(context, attrs, defStyle);
mContext = context;
initBounceScrollView();
}
private void initBounceScrollView()
{
//get the density of the screen and do some maths with it on the max overscroll distance
//variable so that you get similar behaviors no matter what the screen size
final DisplayMetrics metrics = mContext.getResources().getDisplayMetrics();
final float density = metrics.density;
mMaxYOverscrollDistance = (int) (density * MAX_Y_OVERSCROLL_DISTANCE);
}
#Override
protected boolean overScrollBy(int deltaX, int deltaY, int scrollX, int scrollY, int scrollRangeX, int scrollRangeY, int maxOverScrollX, int maxOverScrollY, boolean isTouchEvent)
{
//This is where the magic happens, we have replaced the incoming maxOverScrollY with our own custom variable mMaxYOverscrollDistance;
return super.overScrollBy(deltaX, deltaY, scrollX, scrollY, scrollRangeX, scrollRangeY, maxOverScrollX, mMaxYOverscrollDistance, isTouchEvent);
}
}
Step 2: At your layout, please change
<ScrollView
android:id="#+id/list"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
to
<com.base.view.BounceScrollView
android:id="#+id/list"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
I have improved version of this answer: https://stackoverflow.com/a/13391248/3256989 .
So my version is (example for HorizontalScrollView):
public class HorizontalOverScrollView extends HorizontalScrollView {
private static final int WIDTH_DEVIDER_OVERSCROLL_DISTANCE = 3;
private TimeInterpolator mInterpolator;
private int mMaxOverscrollDistance;
private int mAnimTime;
private long mStartTime;
/**
* Instantiates {#link HorizontalOverScrollView} object.
*/
public HorizontalOverScrollView(final Context context) {
super(context);
init();
}
/**
* Instantiates {#link HorizontalOverScrollView} object.
*/
public HorizontalOverScrollView(final Context context, final AttributeSet attrs) {
super(context, attrs);
init();
}
/**
* Instantiates {#link HorizontalOverScrollView} object.
*/
public HorizontalOverScrollView(final Context context, final AttributeSet attrs, final int defStyleAttr) {
super(context, attrs, defStyleAttr);
init();
}
private void init() {
final int widthPixels = getContext().getResources().getDisplayMetrics().widthPixels;
mMaxOverscrollDistance = widthPixels / WIDTH_DEVIDER_OVERSCROLL_DISTANCE;
mAnimTime = getContext().getResources().getInteger(android.R.integer.config_mediumAnimTime);
mInterpolator = new DecelerateInterpolator();
}
#Override
protected boolean overScrollBy(int deltaX, int deltaY, int scrollX, int scrollY, int scrollRangeX, int scrollRangeY, int maxOverScrollX, int maxOverScrollY, boolean isTouchEvent) {
int overScrollDistance = mMaxOverscrollDistance;
if (isTouchEvent) {
mStartTime = AnimationUtils.currentAnimationTimeMillis();
} else {
final long elapsedTime = AnimationUtils.currentAnimationTimeMillis() - mStartTime;
float interpolation = mInterpolator.getInterpolation((float) elapsedTime / mAnimTime);
interpolation = interpolation > 1 ? 1 : interpolation;
overScrollDistance -= overScrollDistance * interpolation;
overScrollDistance = overScrollDistance < 0 ? 0 : overScrollDistance;
}
return super.overScrollBy(deltaX, deltaY, scrollX, scrollY, scrollRangeX, scrollRangeY, overScrollDistance, maxOverScrollY, isTouchEvent);
}
}
It's called overscroll in Android.
See http://developer.android.com/reference/android/widget/OverScroller.html and
(for example) http://developer.android.com/reference/android/widget/ListView.html#setOverscrollFooter(android.graphics.drawable.Drawable)
It's only available from API level 9 onward.
However, Samsung devices do seem to support overscroll natively in Android 2.2
Just use OverScrollDecoratorHelper
ScrollView scrollView = (ScrollView) findViewById(R.id.scroll_view);
OverScrollDecoratorHelper.setUpOverScroll(scrollView);
HorizontalScrollView horizontalScrollView = (HorizontalScrollView) findViewById(R.id.horizontal_scroll_view);
OverScrollDecoratorHelper.setUpOverScroll(horizontalScrollView);
https://github.com/EverythingMe/overscroll-decor