Android: Draw a canvas without obscuring row of buttons - android

My problem is probably simple - there are many apps out there that accomplish what I am trying to do.
I have a Relative Layout with a row of buttons and then beneath this I want to draw on a canvas.
My problem is that Canvas draws over the buttons or instead of the buttons so all I end up with is a shape.
This is my code:
package com.android.phil.graphtoggle;
import android.app.Activity;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.drawable.ShapeDrawable;
import android.graphics.drawable.shapes.OvalShape;
import android.os.Bundle;
import android.view.View;
import android.widget.ImageButton;
public class MainActivity extends Activity
{
public int graph_toggle = 0;
public int data_toggle=0;
/** Called when the activity is first created. */
#Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
final ImageButton graph_toggle_button = (ImageButton) findViewById(R.id.graph_toggle);
final ImageButton graph_settings_button = (ImageButton) findViewById(R.id.graph_type);
final ImageButton data_toggle_button = (ImageButton) findViewById(R.id.data_toggle);
CustomDrawableView mCustomDrawableView;
mCustomDrawableView = new CustomDrawableView(this);
setContentView(mCustomDrawableView);
graph_toggle_button.setOnClickListener(new View.OnClickListener()
{
public void onClick(View arg0)
{
if (graph_toggle==2)
{
graph_toggle=0;
}
else
{
graph_toggle++;
}
if (graph_toggle==0)
{
graph_settings_button.setImageResource(R.drawable.close);
}
if (graph_toggle==1)
{
graph_settings_button.setImageResource(R.drawable.ohlc_bars);
}
if(graph_toggle==2)
{
graph_settings_button.setImageResource(R.drawable.candles);
}
}
});
data_toggle_button.setOnClickListener(new View.OnClickListener()
{
public void onClick(View arg0)
{
if (data_toggle==2)
{
data_toggle=0;
}
else
{
data_toggle++;
}
if (data_toggle==0)
{
data_toggle_button.setImageResource(R.drawable.ohlc_bars_daily);
}
if (data_toggle==1)
{
data_toggle_button.setImageResource(R.drawable.ohlc_bars_weekly);
}
if(data_toggle==2)
{
data_toggle_button.setImageResource(R.drawable.ohlc_bars_monthly);
}
}
});
}
public class CustomDrawableView extends View
{
private ShapeDrawable mDrawable;
public CustomDrawableView(Context context)
{
super(context);
int x = 10;
int y = 100;
int width = 300;
int height = 50;
mDrawable = new ShapeDrawable(new OvalShape());
mDrawable.getPaint().setColor(0xff74AC23);
mDrawable.setBounds(x, y, x + width, y + height);
}
protected void onDraw(Canvas canvas)
{
mDrawable.draw(canvas);
}
}
}
This is my xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
android:layout_width="fill_parent"
android:id="#+id/relativeLayout1" xmlns:android="http://schemas.android.com/apk/res/android" android:layout_height="fill_parent">
<ImageButton
android:layout_height="40dip"
android:layout_width="40dip"
android:id="#+id/graph_toggle"
android:src="#drawable/graph_toggle"
android:layout_alignParentLeft="true"
></ImageButton>
<ImageButton
android:layout_height="40dip"
android:layout_width="40dip"
android:id="#+id/graph_type"
android:src="#drawable/close"
android:layout_toRightOf="#+id/graph_toggle"
></ImageButton>
<ImageButton
android:layout_height="40dip"
android:layout_width="40dip"
android:id="#+id/data_toggle"
android:src="#drawable/ohlc_bars_daily"
android:layout_toRightOf="#+id/graph_type"
></ImageButton>
<ImageButton
android:layout_height="40dip"
android:layout_width="40dip"
android:id="#+id/data_toggle1"
android:src="#drawable/ohlc_bars_daily"
android:layout_toRightOf="#+id/data_toggle"
></ImageButton>
<ImageButton
android:layout_height="40dip"
android:layout_width="40dip"
android:id="#+id/data_toggle2"
android:src="#drawable/ohlc_bars_daily"
android:layout_toRightOf="#+id/data_toggle1"
></ImageButton>
<ImageButton
android:layout_height="40dip"
android:layout_width="40dip"
android:id="#+id/data_toggle3"
android:src="#drawable/ohlc_bars_daily"
android:layout_toRightOf="#+id/data_toggle2"
></ImageButton>
<ImageButton
android:layout_height="40dip"
android:layout_width="40dip"
android:id="#+id/data_toggle4"
android:src="#drawable/ohlc_bars_daily"
android:layout_toRightOf="#+id/data_toggle3"
></ImageButton>
</RelativeLayout>

You're substituting your whole xml layout with your custom view when you call:
setContentView(mCustomDrawableView);
You should rather add your custom view to the layout, something like:
RelativeLayout mainLayout = (RelativeLayout)findViewById(R.id.relativeLayout1);
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(/*up to you*/);
// add here other layout params rules to make your
// custom view stay below the buttons
mCustomDrawableView.setLayoutParams(lp);
mainLayout.addView(mCustomDrawableView);
However you should also consider adding to your custom view this kind of constructor:
public CustomDrawableView(Context context, AttributeSet attrs) {
super(context, attrs);
// add other init stuff
}
so that you can use your custom view into the xml, making it easier to specify layout params, because doing it in code can be boring for a RelativeLayout.

create a class which extends the framelayout class and overwrite the onDraw function
there you can draw everything you want and it will behave like any other view

Related

How to change a textview from a custom view's class

Let's say I have a custom view inside an activity and a TextView just below that custom view. I would like to change the TextView's text once the custom view was clicked but I seem to get a null pointer when I use findViewById(), so how can I do that?
<?xml version="1.0" encoding="utf-8"?>
<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="com.yuvaleliav1gmail.quoridor_ye.MainActivity"
android:background="#dd7d23">
<com.yuvaleliav1gmail.quoridor_ye.ComBoardView
android:layout_width="900px"
android:layout_height="900px"
android:id="#+id/bview"
android:background="#drawable/game_board"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true" />
<RadioGroup
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/radioGroup"
android:layout_below="#+id/bview"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true">
<RadioButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Move Pawn"
android:id="#+id/radioPawn"
android:checked="true"
android:onClick="radioButtonClick"/>
<RadioButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Set VERTICAL Wall"
android:id="#+id/verticalRdio"
android:checked="false"
android:onClick="radioButtonClick"/>
<RadioButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Set HORIZONTAL Wall"
android:id="#+id/horizontalRdio"
android:checked="false"
android:onClick="radioButtonClick"/>
</RadioGroup>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="Your turn"
android:id="#+id/turnText34"
android:layout_gravity="center_horizontal"
android:layout_below="#+id/radioGroup"
android:layout_alignLeft="#+id/bview"
android:layout_alignStart="#+id/bview" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="Your walls left: "
android:id="#+id/yourWallsText"
android:layout_gravity="center_horizontal"
android:layout_below="#+id/turnText34"
android:layout_alignLeft="#+id/turnText34"
android:layout_alignStart="#+id/turnText34" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="10"
android:id="#+id/yourNumText"
android:layout_gravity="center_horizontal"
android:layout_alignTop="#+id/yourWallsText"
android:layout_toRightOf="#+id/yourWallsText"
android:layout_toEndOf="#+id/yourWallsText" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="Opponent&apos;s walls left:"
android:id="#+id/opWallsText"
android:layout_gravity="center_horizontal"
android:layout_below="#+id/yourWallsText"
android:layout_alignLeft="#+id/yourWallsText"
android:layout_alignStart="#+id/yourWallsText" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="10"
android:id="#+id/opNumText"
android:layout_gravity="center_horizontal"
android:layout_alignTop="#+id/opWallsText"
android:layout_toRightOf="#+id/opWallsText"
android:layout_toEndOf="#+id/opWallsText" />
</RelativeLayout>
comBoardView is the custom view's class
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Point;
import android.os.CountDownTimer;
import android.os.Handler;
import android.util.AttributeSet;
import android.view.Display;
import android.view.MotionEvent;
import android.view.View;
import android.view.WindowManager;
import android.widget.TextView;
import android.widget.Toast;
public class ComBoardView extends View {
private static final int ROWS = 9;
private static final int COLUMNS = 9;
public static Context con;
Paint paint;
GameService game;
TextView turns;
public static Point size = new Point();
/*
* constructor
*/
public ComBoardView(Context context, AttributeSet attrs) {
super(context, attrs);
con = context;
paint = new Paint();
WindowManager wm = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE);
Display display = wm.getDefaultDisplay();
display.getSize(size);
turns = (TextView) findViewById(R.id.turnText34);
}
/*
*/
public boolean onTouchEvent( MotionEvent event ) {
game = GameService.getInstance();
int x = (int)event.getX() / 100;
int y = (int)event.getY() / 100;
if ( event.getAction() != MotionEvent.ACTION_UP )
return true;
if(game.movePawn){
if(game.turn % 2 == 0){
if(game.isLegalMove(game.ai.MyLocation , y * ROWS + x)){
game.board.ClrPlayer(game.ai);
game.ai.MyLocation = y * ROWS + x;
game.board.SetPlayer(game.ai);
if(turns != null){
turns.setText("white's turn");
}
game.turn++;
}
}
else{
if(game.isLegalMove(game.player.MyLocation , y * ROWS + x)){
game.board.ClrPlayer(game.player);
game.player.MyLocation = y * ROWS + x;
game.board.SetPlayer(game.player);
if(turns != null){
turns.setText("black's turn");
}
game.turn++;
}
}
}
else {
if(((int)event.getX() % 100) < 50) x--;
if(((int)event.getY() % 100) < 50) y--;
if(game.setHWall){
game.board.SetHWall(y,x);
game.turn++;
}
else{
game.board.SetVWall(y,x);
game.turn++;
}
}
return true;
}
public void RestartTimer() {
new CountDownTimer(3500, 1000) {
public void onTick(long millisUntilFinished) {
final Toast toast = Toast.makeText(con, "restarting in: " + millisUntilFinished / 1000, Toast.LENGTH_LONG);
toast.show();
new Handler().postDelayed(new Runnable() {
#Override
public void run() {
toast.cancel();
}
}, 1000);
}
public void onFinish() {
}
}.start();
}
protected void onDraw(Canvas canvas) {
paint.setAntiAlias(true);
paint.setColor(Color.BLACK);
GameService.getInstance().onDraw(canvas, paint);
}
}
and game is the activity's class
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.RadioButton;
import java.util.Timer;
public class Game extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_game);
Timer timer = new Timer();
GameUpdateTimer ut = new GameUpdateTimer();
ut.boardView = (ComBoardView)this.findViewById(R.id.bview);
timer.schedule(ut, 200, 200);
RadioButton pawn = (RadioButton)findViewById(R.id.radioPawn);
RadioButton hWall = (RadioButton)findViewById(R.id.horizontalRdio);
RadioButton vWall = (RadioButton)findViewById(R.id.verticalRdio);
final GameService g = GameService.getInstance();
pawn.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
g.movePawn = true;
g.setHWall = false;
}});
hWall.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
g.movePawn = false;
g.setHWall = true;
}
});
vWall.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
g.movePawn = false;
g.setHWall = false;
}
});
}
}
You can't call turns = (TextView) findViewById(R.id.turnText34); from your custom view, it will always return Null because TextView exist in the activity xml and not in ComBoardView.
What you can do, is to instantiate your TextView in the activity, then add a clickListener to your ComBoardView.
TextView turns;
#Override
protected void onCreate(Bundle savedInstanceState) {
//...
turns = (TextView) findViewById(R.id.turnText34);
ut.boardView.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
turns.setText("ComBoardView was clicked!");
}});
//...
}

How to make a list of square buttons with autoresize?

I am developing an app that displays a page with a variable number of square buttons, like the second picture of "Square MIUI":
Square MIUI on APP store
I need displaying only three columns of square buttons, and make the entire list scrollable.
I'm trying first with plain XML:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:orientation="vertical" >
<ScrollView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_gravity="center"
android:layout_weight="1.19"
android:orientation="horizontal" >
<TableLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center" >
<TableRow
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:layout_weight="1" >
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="Title"/>
</TableRow>
<TableRow
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<!-- Icon buttons here -->
</TableRow>
</TableLayout>
</ScrollView>
<Button
android:layout_width="fill_parent"
android:layout_height="48dp"
android:text="Button" />
</LinearLayout>
For every button (4 TableRow of 3 buttons, images are square .png made with Eclipse icon generator)
EDIT: checked, icons of all screen densities are square
<Button
android:layout_margin="4dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="image"/>
but the buttons on my tablet are square, and on my phone are wider than tall (stretched on X-axis).
What I'm doing wrong?
TODO: code a variable button number.
Thanks in advance.
EDIT:
I tried this code:
private void squareButton() {
square(R.id.b1);
square(R.id.b2);
....
square(R.id.b<N>);
}
private void square(int id) {
ImageButton temp=(ImageButton) findViewById(id);
int l=temp.getWidth();
DisplayMetrics metrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(metrics);
int Measuredwidth = metrics.widthPixels;
l=(int) (Measuredwidth/4);
temp.setMaxWidth(l);
temp.setMaxHeight(l);
temp.setMinimumWidth(l);
temp.setMinimumHeight(l);
LayoutParams param = temp.getLayoutParams();
param.width = l;
param.height = l;
temp.setLayoutParams(param);
temp.requestLayout();
}
But I'm still getting weird buttons on phone (Gingerbread)...
I can't rely only on the auto-sized icons (too little on my tablet, too big on my phone)
EDIT:
I'm looking for a code that:
squares button
has user-definable width
works with Gingerbread
In my case, button_width = widthPixels/4;
Thank you in advance.
Implements you own square button class like this:
public class SquareButton extends Button {
public SquareButton(Context context) {
super(context);
}
public SquareButton(Context context, AttributeSet attrs) {
super(context, attrs);
}
public SquareButton(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
#Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
setMeasuredDimension(getMeasuredWidth(), getMeasuredWidth()); // Snap to width
}
}
Finally, I found a solution using GridView.
First, I follow the GridView tutorial
Then I got some code from other answers.
Now this code creates a scrollable and clickable big square icon list, resized according to screen size. When one icon is clicked, changes his image.
Thank you Lubos for your suggestion.
[main activity]
public class Grid extends Activity {
public boolean audio=true;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_grid);
GridView gridview = (GridView) findViewById(R.id.gridview);
gridview.setAdapter(new ImageAdapter(this));
// load icons on grid
ImageAdapter.loadImages(new Integer[] {
R.drawable.ic_blu_voice_on,
R.drawable.ic_blu_help,
R.drawable.ic_blu_save,
R.drawable.ic_blu_load
});
gridview.setOnItemClickListener(new OnItemClickListener() {
public void onItemClick(AdapterView<?> parent, View imgView, int position, long id) {
ImageView image=(ImageView) imgView;
switch (position) {
case 0:
// switch voice icon on/off when clicked
image.setImageResource(voice());
break;
}
Toast.makeText(Grid.this, "" + position, Toast.LENGTH_SHORT).show();
}
});
}
private int voice() {
audio=!audio;
if (audio) return R.drawable.ic_blu_voice_on;
return R.drawable.ic_blu_voice_off;
}
}
[imageadapter.java]
public class ImageAdapter extends BaseAdapter {
private Context mContext;
// reference to images (dummy)
private static Integer[] mThumbIds = {0,0};
private float px;
public ImageAdapter(Context c) {
mContext = c;
//Calculation of ImageView Size - density independent.
Resources r = Resources.getSystem();
px = r.getDisplayMetrics().widthPixels;
px=px/3;
}
public int getCount() {
return mThumbIds.length;
}
public Object getItem(int position) {
return null;
}
public long getItemId(int position) {
return 0;
}
public static void setImage(int position, int id) {
mThumbIds[position]=id;
}
public static void loadImages(Integer[] images) {
mThumbIds = images;
}
// create a new ImageView for each item referenced by the Adapter
public View getView(int position, View convertView, ViewGroup parent) {
ImageView imageView;
if (convertView == null) { // if it's not recycled, initialize some attributes
imageView = new ImageView(mContext);
imageView.setLayoutParams(new GridView.LayoutParams((int)px, (int)px));
imageView.setScaleType(ImageView.ScaleType.FIT_XY);
imageView.setPadding(8, 8, 8, 8);
} else {
imageView = (ImageView) convertView;
}
imageView.setImageResource(mThumbIds[position]);
return imageView;
}
}
[activity_grid.xml]
<RelativeLayout xmlns:tools="http://schemas.android.com/tools"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_gravity="center_horizontal"
android:orientation="vertical"
tools:context="${packageName}.${activityClass}">
<LinearLayout
android:id="#+id/LinearLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center_horizontal"
android:orientation="vertical"
tools:context="${relativePackage}.${activityClass}" >
<TextView
android:id="#+id/testo1"
android:layout_width="fill_parent"
android:layout_height="48dp"
android:gravity="center_horizontal"
android:text="#string/hello_world"
android:textSize="30sp" />
<GridView
android:id="#+id/gridview"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:columnWidth="120dp"
android:gravity="center"
android:numColumns="auto_fit"
android:stretchMode="spacingWidthUniform">
</GridView>
<Button
android:id="#+id/button"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/hello_world"
android:textSize="30sp" />
</LinearLayout>
</RelativeLayout>

Implementing Simple SeekBar in android

Filters.java
public class Filters extends Activity implements OnSeekBarChangeListener{
private SeekBar PRICEbar,DISTANCEbar, RATINGbar; // declare seekbar object variable
// declare text label objects
private TextView PRICEtextProgress,DISTANCEtextProgress, RATINGtextProgress;
/** Called when the activity is first created. */
#Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
// load the layout
setContentView(R.layout.filters);
PRICEbar = (SeekBar)findViewById(R.id.PRICEseekBarID); // make seekbar object
PRICEbar.setOnSeekBarChangeListener(this);
PRICEbar.setOnSeekBarChangeListener(new OnSeekBarChangeListener() {
#Override
public void onStopTrackingTouch(SeekBar seekBar) {
// TODO Auto-generated method stub
}
#Override
public void onStartTrackingTouch(SeekBar seekBar) {
// TODO Auto-generated method stub
}
#Override
public void onProgressChanged(SeekBar seekBar, int progress,
boolean fromUser) {
// TODO Auto-generated method stub
PRICEtextProgress = (TextView)findViewById(R.id.PRICEtextViewProgressID);
PRICEtextProgress.setText("Price:: Rs "+progress);
}
});
}
#Override
public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
if (seekBar == PRICEbar)
PRICEtextProgress.setText("Price:: Rs "+progress);
}
#Override
public void onStartTrackingTouch(SeekBar seekBar) {
// TODO Auto-generated method stub
}
#Override
public void onStopTrackingTouch(SeekBar seekBar) {
// TODO Auto-generated method stub
}
}
filters.xml
<LinearLayout 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:orientation="vertical" >
<RelativeLayout
android:id="#+id/relativeLayoutforPRICE"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/PRICEtextViewProgressID"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:text="Price"
android:textAppearance="?android:attr/textAppearanceLarge" >
</TextView>
<SeekBar
android:id="#+id/PRICEseekBarID"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/textView1"
android:layout_marginTop="26dp"
android:max="100" >
</SeekBar>
</RelativeLayout>
</LinearLayout>
I have an output like this::
How to modify my code to get initial and final values in the seek bar as in figure below?
You have already defined max value of seekbar
android:max="100"
Now you need to add two textviews on left and right of seekbar. Use Relative layout and align both textviews Left and Right to the parent.
Brontok's hint solved my problem. I just had to alter the XML. I want to share the result here:
<RelativeLayout
android:id="#+id/relativeLayoutforPRICE"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/PRICEtextViewProgressID"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:text="Price"
android:textAppearance="?android:attr/textAppearanceLarge" >
</TextView>
<SeekBar
android:id="#+id/PRICEseekBarID"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/textView1"
android:layout_marginTop="26dp"
android:max="100" >
</SeekBar>
<TextView
android:id="#+id/PRICEinitialvaluetextID"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/PRICEseekBarID"
android:text="Rs 0" >
</TextView>
<TextView
android:id="#+id/PRICEinitialvaluetextID"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#+id/PRICEseekBarID"
android:text="Rs 100" />
</RelativeLayout>
First, I think you should extend SeekBar.
Second, call canvas.drawText() in onDraw() method to draw text before SeekBar and after SeekBar.
This way you can refresh the textView in your onDraw method callback
check it out, You implemented OnSeekBarChangeListener created methods, and set
public class Filters extends Activity implements OnSeekBarChangeListener{
PRICEbar.setOnSeekBarChangeListener(this);
and next line you override it with new OnSeekBarChangeListener
PRICEbar.setOnSeekBarChangeListener(new OnSeekBarChangeListener() {
you can delete implements OnSeekBarChangeListener and these 3 empty methods from your activity (onSeekBarChange, onStartTracking, onStopTracking)
just for fun with an empty linear layout in main.xml
a sample with seekbar
import android.app.*;
import android.os.*;
import android.view.*;
import android.content.*;
import android.graphics.*;
import android.graphics.Color.*;
import android.graphics.drawable.*;
import android.graphics.drawable.shapes.*;
import android.widget.*;
import android.widget.ProgressBar;
import android.text.*;
//import org.apache.http.impl.conn.*;
import android.util.*;
import android.view.View.*;
import android.widget.SeekBar.*;
public class MainActivity extends Activity {
public int angle=30;
#Override
//CustomDrawableView customDrawableView;
LinearLayout myLayout;
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
myLayout = findViewById(R.id.linear_layout);
//setContentView(customDrawableView);
/* TextView text1 = new TextView(this);
text1.setText(R.string.hello_world);
myLayout.addView(text1);
*/
final TextView text2 = new TextView(this);
text2.setText("30");
myLayout.addView(text2);
SeekBar seek = new SeekBar(this);
//seek.setMin(2);
seek.setMax(180);
seek.setProgress(30);
myLayout.addView(seek);
final CustomDrawableView customDrawableView = new CustomDrawableView(this);
myLayout.addView(customDrawableView);
customDrawableView.setBackgroundColor(0x00888888);
seek.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener(){
public void onProgressChanged(SeekBar seek,int value,boolean usr){
angle = value;
if (angle<=2) angle = 2;
text2.setText(String.valueOf(value));
customDrawableView.invalidate();
}
public void onStartTrackingTouch(SeekBar seek){
}
public void onStopTrackingTouch(SeekBar seek){
}
});
//customDrawableView.setRotationX(45);
}; // MainActivity_onCreate
public class CustomDrawableView extends View {
private int n=16;
private ShapeDrawable[] drws = new ShapeDrawable[4*n];
protected Canvas canvas;
public CustomDrawableView(Context context) {
super(context);
setContentDescription(context.getResources().getString(
R.string.my_view_desc));
angle = 30;
};
protected void onDraw(Canvas oCanvas) {
canvas = oCanvas;
show();
}; // onDraw
public void show() {
int cx = canvas.getWidth()/2;
int cy = canvas.getHeight()/2;
int color = Color.argb(0x88,0x00,0x99,0xff);
int stp;
for (int s=0;s<180;s+=angle){
canvas.rotate(angle,cx,cy);
for (int i=0;i<=15;i++){
stp = 29 - i;
color = Color.argb(i*10, i*17, 0xaa, 0xff - i*10);
drws[i] = new ShapeDrawable(new OvalShape());
drws[i].getPaint().setColor(color);
drws[i].setBounds(cx+stp*i, cy+10, cx+30+stp*i, cy+20);
drws[n+i] = new ShapeDrawable(new OvalShape());
drws[n+i].getPaint().setColor(color);
drws[n+i].setBounds(cx+10+stp*i, cy, cx+20+stp*i, cy+30);
drws[2*n+i] = new ShapeDrawable(new OvalShape());
drws[2*n+i].getPaint().setColor(color);
drws[2*n+i].setBounds(cx-stp*i-30, cy-20, cx-stp*i, cy-10);
drws[3*n+i] = new ShapeDrawable(new OvalShape());
drws[3*n+i].getPaint().setColor(color);
drws[3*n+i].setBounds(cx-stp*i-20, cy-30, cx-stp*i-10, cy);
canvas.rotate(22.5f,cx,cy);
drws[i].draw(canvas);
drws[n+i].draw(canvas);
drws[2*n+i].draw(canvas);
drws[3*n+i].draw(canvas);
}
canvas.rotate(angle,cx,cy);
}
}
}; // CustomDrawableView
}; // MainActivity

GridView scrolling weird issue

let me explain my problem.
I'm using a GridView with a custom adapter, and everything works fine. As the title says the problem comes when I scroll fast.
Scrolling slow works perfectly, but when I scroll fast and reach end I've got like a "kickback" to the middle of the grid, but this problem doesn't apear when I scroll fast from the back to the top.
I'm coding for 2.3.3 using 4.2 sdk version.
I'm testing on a 2.3.3 real phone and on a 4.2 emulator, same results.
Thanks for your futur answer ! (Sorry for my poor written English)
Here you are the code of my adapter.
import java.util.ArrayList;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.TextView;
#SuppressWarnings("unused")
public class RadioAdapter extends BaseAdapter {
private Context context;
private final ArrayList<Radio> radios;
private LayoutInflater inflater;
public RadioAdapter(Context context, ArrayList<Radio> radios) {
this.context = context;
this.radios = radios;
inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
}
#Override
public int getCount() {
return radios.size();
}
#Override
public Radio getItem(int position) {
// TODO Auto-generated method stub
return null;
}
#Override
public long getItemId(int position) {
// TODO Auto-generated method stub
return 0;
}
#Override
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder holder;
Radio radio = radios.get(position);
if (convertView == null) {
convertView = inflater.inflate(R.layout.item, null);
holder = new ViewHolder();
holder.textView = (TextView) convertView.findViewById(R.id.grid_item_label);
holder.imageView = (ImageView) convertView.findViewById(R.id.grid_item_cover);
convertView.setTag(holder);
} else {
holder = (ViewHolder)convertView.getTag();
}
holder.textView.setText(radio.getName());
holder.imageView.setImageResource(radio.getThumbnail());
return convertView;
}
public static class ViewHolder {
TextView textView;
ImageView imageView;
}
}
EDIT3:
After some more research I've found this : https://github.com/Prototik/HoloEverywhere/issues/282
Are you using android:overScrollMode="never"? There is a bug in
scroller implementation in Gingerbread: http://code.google.com/p/android/issues/detail?id=15860
So the problem I have is normal on Gingerbread, damn.
I've tested with a 4.0.3 phone and it works normally. Problem solved.
EDIT2:
I've detected that the problem comes with
android:overScrollMode="never"
EDIT:
Here you are my layout :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
tools:context=".MainActivity" >
<ImageView
android:id="#+id/imageView1"
android:scaleType="fitStart"
android:adjustViewBounds="true"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:src="#drawable/top_bar" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text="#string/app_name"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#color/White"
android:layout_alignLeft="#+id/imageView1"
android:layout_alignTop="#+id/imageView1"
android:layout_alignRight="#+id/imageView1"
android:layout_alignBottom="#+id/imageView1"
android:gravity="center" />
<censored.RadioView
android:layout_below="#id/imageView1"
android:id="#+id/gridView1"
android:numColumns="auto_fit"
android:columnWidth="100dp"
android:stretchMode="spacingWidthUniform"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:listSelector="#drawable/grid_selector"
android:drawSelectorOnTop="false"
android:overScrollMode="never"
android:fadingEdge="none"
android:scrollbars="none">
</censored.RadioView>
</RelativeLayout>
And the code of my RadioView
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.util.AttributeSet;
import android.widget.GridView;
public class RadioView extends GridView{
private Bitmap background;
public RadioView(Context context) {
super(context);
init();
}
public RadioView(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}
public RadioView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
init();
}
protected void init() {
background = BitmapFactory.decodeResource(getResources(), R.drawable.shelfcell_bgr);
}
#Override
protected void dispatchDraw(Canvas canvas) {
int top = getChildCount() > 0 ? getChildAt(0).getTop() : 0;
for (int y = top; y < getHeight(); y += background.getHeight()){
for (int x = 0; x < getWidth(); x += background.getWidth()){
canvas.drawBitmap(background, x, y, null);
}
}
super.dispatchDraw(canvas);
}
}
After some more research I've found this :
https://github.com/Prototik/HoloEverywhere/issues/282
Are you using android:overScrollMode="never"? There is a bug in
scroller implementation in Gingerbread:
http://code.google.com/p/android/issues/detail?id=15860
So the problem I have is normal on Gingerbread, damn.
I've tested with a 4.0.3 phone and it works normally. Problem solved.

how to clear view in android?

I have created a simple demo application in android for drawing ,now can any one say me how can i remove view and clear screen in just one click .I have tried as below:please help me to do it....thanx in advance..!
main.java
package com.example.singletouch;
import com.example.singletouch.R.attr;
import android.os.Bundle;
import android.app.Activity;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.ImageView;
import android.widget.LinearLayout;
public class MainActivity extends Activity {
ImageView pen;
SingleTouchView mDrawView;
ImageView remove;
LinearLayout pens;
LinearLayout pen1, pen2, pen3, pen4;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mDrawView = (SingleTouchView) findViewById(R.id.myview);
pen = (ImageView) findViewById(R.id.pen);
pens = (LinearLayout) findViewById(R.id.linear);
pens.setVisibility(View.GONE);
pen1 = (LinearLayout) findViewById(R.id.pen1);
pen2 = (LinearLayout) findViewById(R.id.pen2);
pen3 = (LinearLayout) findViewById(R.id.pen3);
pen4 = (LinearLayout) findViewById(R.id.pen4);
remove=(ImageView)findViewById(R.id.remove);
/*
* pen1.setOnClickListener(this); pen2.setOnClickListener(this);
* pen3.setOnClickListener(this); pen4.setOnClickListener(this);
*/
pen.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
// TODO Auto-generated method stub
pens.setVisibility(View.VISIBLE);
}
});pens.setVisibility(View.GONE);
pen1.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
mDrawView.setPen(SingleTouchView.DrawingPens.PEN_1);
pens.setVisibility(View.GONE);
}
});
pen2.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
mDrawView.setPen(SingleTouchView.DrawingPens.PEN_2);
pens.setVisibility(View.GONE);
}
});
pen3.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
pens.setVisibility(View.GONE);
mDrawView.setPen(SingleTouchView.DrawingPens.PEN_3);
}
});
pen4.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
pens.setVisibility(View.GONE);
mDrawView.setPen(SingleTouchView.DrawingPens.PEN_4);
}
});
remove.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
}
});
}
}
SingleTouchView.java
package com.example.singletouch;
import java.util.AbstractMap;
import java.util.Map;
import java.util.concurrent.ConcurrentLinkedQueue;
import android.R.color;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.PorterDuff.Mode;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;
import android.widget.ImageView;
import android.widget.Switch;
public class SingleTouchView extends View{
public int width;
public int height;
public Bitmap mBitmap;
public Canvas mCanvas;
public Path mPath;
public Paint mBitmapPaint;
Context context;
public Paint circlePaint;
public Path circlePath;
public enum DrawingPens {
PEN_1(6),
PEN_2(4),
PEN_3(2),
PEN_4(1);
final public Paint mPaint;
/**
* Constructor
*
* #param width width of stroke
* #param color color of stroke
*/
private DrawingPens(final int width) {
mPaint = new Paint();
mPaint.setAntiAlias(true);
mPaint.setStrokeWidth(width);
//mPaint.setColor(color);
mPaint.setStyle(Paint.Style.STROKE);
mPaint.setStrokeJoin(Paint.Join.ROUND);
}
/**
* #return corresponding paint
*/
Paint getPaint() {
return mPaint;
}
}
public SingleTouchView(final Context context) {
super(context);
init(context);
}
public SingleTouchView(final Context context, final AttributeSet attrs) {
super(context, attrs);
init(context);
}
public SingleTouchView(final Context context, final AttributeSet attrs, final int defStyle) {
super(context, attrs, defStyle);
init(context);
}
/** To store Paint - Path relation */
// TODO: depending on exact limits, more optimal ways can be found
private ConcurrentLinkedQueue<Map.Entry<Path, DrawingPens>> mPaths = new ConcurrentLinkedQueue<Map.Entry<Path, DrawingPens>>();
/** Cached current path, <b>NOTE:</b> this field is tail at mPaths and is used it only for caching, not drawing */
private Path mCurrentPath;
/**
* Inits internal views data, should be called from every constructor
*
* #param context {#link Context}
*/
private void init(final Context context) {
/* TODO: if some values of paints cannot be determined in static context (in enum),
then Paints should be created here and used via EnumMap */
// Initial pen
setPen(DrawingPens.PEN_1);
}
#Override
public void onDraw(Canvas canvas){
// just to draw background
super.onDraw(canvas);
// Draw all paths
for (Map.Entry<Path, DrawingPens> entry : mPaths) {
canvas.drawPath(entry.getKey(), entry.getValue().getPaint());
}
}
#Override
public boolean onTouchEvent(MotionEvent me){
float eventX = me.getX();
float eventY = me.getY();
switch (me.getAction()) {
case MotionEvent.ACTION_DOWN:
mCurrentPath.moveTo(eventX, eventY);
return true;
case MotionEvent.ACTION_MOVE:
mCurrentPath.lineTo(eventX, eventY);
break;
case MotionEvent.ACTION_UP:
break;
}
invalidate();
return true;
}
/**
* Setter for new pen
*
* #param pen {#link DrawingPens} to be used for next drawing
*/
public void setPen(final DrawingPens pen) {
// put latest item to the queue
mCurrentPath = new Path();
mPaths.add(new AbstractMap.SimpleImmutableEntry<Path, DrawingPens>(mCurrentPath, pen));
}
public void clear(View v){
}
}
main.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
tools:context=".MainActivity" >
<com.example.singletouch.SingleTouchView
android:id="#+id/myview"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above="#+id/pen" />
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#drawable/menubar"
android:padding="2dp"
android:weightSum="4" >
<ImageView
android:id="#+id/pen"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_alignParentBottom="true"
android:layout_weight="1"
android:gravity="center"
android:src="#drawable/pen" />
<ImageView
android:id="#+id/eraser"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_alignParentBottom="true"
android:layout_weight="1"
android:src="#drawable/eraser" />
<ImageView
android:id="#+id/color"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_alignParentBottom="true"
android:layout_weight="1"
android:src="#drawable/color" />
<ImageView
android:id="#+id/remove"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_alignParentBottom="true"
android:layout_weight="1"
android:src="#drawable/remove" />
</LinearLayout>
<LinearLayout
android:id="#+id/linear"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/linearLayout1"
android:layout_alignParentLeft="true"
android:background="#eeeeee"
android:orientation="horizontal"
android:visibility="gone"
android:weightSum="4" >
<LinearLayout
android:id="#+id/pen1"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"
android:gravity="center" >
<ImageView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:src="#drawable/pen1" />
</LinearLayout>
<LinearLayout
android:id="#+id/pen2"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"
android:gravity="center" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:src="#drawable/pen2" />
</LinearLayout>
<LinearLayout
android:id="#+id/pen3"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"
android:gravity="center" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#drawable/pen3" />
</LinearLayout>
<LinearLayout
android:id="#+id/pen4"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"
android:gravity="center" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#drawable/pen4" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
Jus use ...
mCanvas.drawColor(Color.BLACK);
... for clearing the canvas or any other color you want to have in background. E.g.
remove.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
// clear canvas contents
mCanvas.drawColor(Color.BLACK);
// create new path list; old one will be garbage collected
ConcurrentLinkedQueue<Map.Entry<Path, DrawingPens>> mPaths =
new ConcurrentLinkedQueue<Map.Entry<Path, DrawingPens>>();
pens.setVisibility(View.VISIBLE);
}
p.s.: for removing a view dynamically from its container use removeView(....), e.g.
((ViewGroup)viewToRemove.getParent()).removeView(viewToRemove);
Hope this helps ... Cheers!
remove.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
layout.removeView(mDrawView);
mDrawView = new SingleTouchView(MainActivity.this);
layout.addView(mDrawView);
}
});
Put the portion of the screen you want cleared in a single layout in xml eg
<RelativeLayout
android:id="#+id/layout"
android:layout_width="wrap_content"
android:layout_height= "wrap_content">
The Views that have to be gone on click
</RelativeLayout>
Then in your code in onClick() of the button give
((RelativeLayout) findViewById(R.id.layout)).setVisiblity(View.GONE));
EDIT :
If you want the ImageView cleared use :
((ImageView) findViewById(R.id.imageView)).setImageDrawable(null);
instead of drawing solid color you can draw transparent color this help you don't cover the other views if you use them as a background for the canvas
mCanvas.drawColor(Color.TRANSPARENT, PorterDuff.Mode.CLEAR);
I got this from this answer: https://stackoverflow.com/a/10882301/8113211

Categories

Resources