I want to write the following application. There is a Canvas
and a Button stacked vertically in a LinearView. When the button
is pressed the first time a circle is drawn in the canvas, then
if pressed again the circle disappears. The circle must appear
centered in its space.
Any ideas?
Thanks,
JG
This should work
Custom View class
public class DrawView extends View {
private Canvas viewCanvas;
public DrawView(Context context) {
super(context);
setLayoutParams(new LayoutParams(LinearLayout.LayoutParams.FILL_PARENT
,LinearLayout.LayoutParams.FILL_PARENT));
}
public DrawView(Context context, AttributeSet attrs) {
super(context, attrs);
}
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
Paint p = new Paint();
p.setColor(Color.RED);
canvas.drawCricle(getWidth()/2,getHeight()/2,50,null);
viewCanvas = canvas;
}
public clearCircle(){
viewCanvas.drawColor(Color.BLACK);
}
}
Activity class should look like this
public class KeyboardTopDemo extends Activity {
private FrameLayout container;
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.ss);
container = (FrameLayout)findViewById(R.id.sc);
container.addView(new DrawView(this));
}
public void clearHandler(View target){
container.getChildAt(0).clearCircle();
}
}
This is the layout xml file
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:orientation="vertical">
<FrameLayout android:orientation="vertical" android:layout_width="fill_parent"
android:layout_height="0dip" android:id="#+id/sc"
android:scrollbars="horizontal" android:layout_weight="1.0">
<ImageView android:layout_width="fill_parent"
android:layout_height="fill_parent" android:src="#drawable/chips"/>
</FrameLayout>
<Button android:layout_width="fill_parent" android:layout_height="wrap_content"
android:text="Clear" android:onClick="clearHandler"/>
</LinearLayout>
Related
This is MainActivity.java code which gets the positions of the imagViews and tries to generate a lineView between the ImageViews by getting the coordinates of the ImageViews.
I'm getting the coordinates of the ImageViews but it's not showing the line between them.
public class MainActivity extends AppCompatActivity {
private ImageView one,two;
private LineView lineView;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
lineView=findViewById(R.id.lineView);
one=findViewById(R.id.one);
two=findViewById(R.id.two);
Random random = new Random();
int x=random.nextInt(500);
int y=random.nextInt(500);
one.setX(x);
one.setY(y);
int c=x;
int d=y;
PointF pointA=new PointF(c,d);
x=random.nextInt(500);
y=random.nextInt(500);
two.setX(x);
two.setY(y);
c=x;
d=y;
PointF pointB=new PointF(c,d);
lineView.setPointA(pointA);
lineView.setPointB(pointB);
lineView.draw();
}
}
This is activity_main.xml that contains the ImageViews and LineView.
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
<xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"
>
<ImageView
android:id="#+id/one"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="116dp"
android:layout_marginTop="197dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/one" />
<ImageView
android:id="#+id/two"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="133dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/two" />
<com.example.testing.LineView
android:id="#+id/lineView"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</android.support.constraint.ConstraintLayout>
This is the Lineview.java code that generates the line view widget and its operations .
public class LineView extends View {
PointF pointA,pointB;
private Paint paint =new Paint();
public LineView(Context context) {
super(context);
}
public LineView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public LineView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
paint.setColor(Color.RED);
paint.setStrokeWidth(20);
canvas.drawLine(pointA.x,pointA.y,pointB.x,pointB.y,paint);
}
public void setPointA(PointF point)
{
pointA=point;
}
public void setPointB(PointF point)
{
pointB=point;
}
public void draw()
{
invalidate();
requestLayout();
}
}
You can do it in your view - put this View between your images:
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#android:color/black" />
The horizontal line between two image views in android
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#FF0000FF"/>
The vertical line between two image views in android
<View
android:layout_width="1dp"
android:layout_height="match_parent"
android:background="#FF0000FF"/>
I have a class that extends a view.
This class is called in xml to build my view. Now the view call the onDraw automatically the onDraw function on loaded. But how i can do what is do on onDraw() function only after i click in that view?? In conclusion i need to execute the code inside onDraw() only after the click in view.
DrawView.java:
public class DrawView extends View {
Paint mPaint = new Paint();
Context context;
public DrawView(Context context, AttributeSet attrs){
super(context, attrs);
this.context = context;
// setWillNotDraw(true);
}
protected void onDraw(Canvas canvas){
super.onDraw(canvas);
mPaint.setColor(Color.MAGENTA);
canvas.drawRect((float) (getWidth()*0.3), (float) (getHeight()*0.3), getWidth(), getHeight(), mPaint);
main.xml:
<LinearLayout
android:orientation="vertical"
android:layout_height="fill_parent"
android:layout_width="0dip"
android:layout_weight="1">
<com.example.sliding.DrawView
android:id="#+id/tv_listRow_item1"
android:tag="tv_listRow_item1_1"
android:layout_height="0dip"
android:layout_width="fill_parent"
android:layout_weight="1"
android:gravity="center"
android:width="100dip"
android:height="30dip"
android:background="#drawable/textview_listrow_border"/>
</LinearLayout>
main.java:
((DrawView)v.findViewById(R.id.tv_listRow_item1)).setOnClickListener(listener);
private View.OnClickListener listener = new OnClickListener() {
#Override
public void onClick(View v) {
}
}
Any suggestions? Thanks for your time and attention.
Try overriding the
public boolean onTouchEvent(MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
// your actions here
}
}
then call invalidate() function, which will set a flag to call the onDraw() of your view.
I have a GraphicsView class that extends from the View class and I want to add this GraphicsView class to the main layout in my project. How can I do that?
static public class GraphicsView extends View {
public GraphicsView(Context context) {
super(context);
}
#Override
protected void onDraw(Canvas canvas) {
// Drawing commands go here
Path rect = new Path();
rect.addRect(100, 100, 250, 50, Direction.CW);
Paint cPaint = new Paint();
cPaint.setColor(Color.LTGRAY);
canvas.drawPath(rect, cPaint);
}
}
and my main.xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/linnnnlayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/hello" />
<TextView
android:id="#+id/Customfont"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/hello" />
<View
android:id="#+id/view"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
</LinearLayout>
You need to give complete path of your class that extends View,
<com.blah.blah.GraphicsView
android:id="#+id/view"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
If I remember correctly, you need to provide more constructors to use view from xml file (add it to xml file like "Me and We" suggested).
public GraphicsView(Context context) {
super(context);
}
public GraphicsView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public GraphicsView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
Update: fixed code.
i finaly got it here is the code
the XML code
<com.customfonts.namespace.BreakDownBar
android:id="#+id/gview"
android:layout_width="fill_parent"
android:layout_height="20dip"
android:layout_marginLeft="10dip"
android:layout_marginRight="10dip"
android:background="#color/BreakDownBarBack"/>
and the class
package com.customfonts.namespace;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.Path.Direction;
import android.util.AttributeSet;
import android.view.View;
public class BreakDownBar extends View {
public BreakDownBar(Context context, AttributeSet attrs) {
super(context, attrs);
}
#Override
protected void onDraw(Canvas canvas) {
//Draw rectangle;
Path rect = new Path();
rect.addRect(0, 0,250, 150,Direction.CW);
Paint cpaint = new Paint();
cpaint.setColor(Color.GREEN);
canvas.drawPath(rect, cpaint);
}
}
you need to do this:
LinearLayout v = (LinearView) findViewById(R.id.linnnnlayout);
GraphicsView myView = new myGraphicsView(this);
v.addView(myView);
Because your custom View is an inner class in your Activity the java compiler will output the name ActivityName$GraphicsView for that class. You can't use that name directly as the View name in the xml layout because of the $ character but you can do it like this:
<view
class="com.package.here.ActivityName$GraphicsView"
android:id="#+id/view"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
where ActivityName is the name of the activity where your GraphicsView class is declared.
public class MainActivity extends Activity {
/** Called when the activity is first created. */
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
LinearLayout v = (LinearLayout) findViewById(R.id.linearLayout);
MyGraphics myView = new MyGraphics(this);
v.addView(myView);
}
}
public class MyGraphics extends View {
public MyGraphics(Context context) {
super(context);
}
#Override
protected void onDraw(Canvas canvas) {
// Drawing commands go here
Path rect = new Path();
rect.addRect(100, 100, 250, 50, Direction.CW);
Paint cPaint = new Paint();
cPaint.setColor(Color.LTGRAY);
canvas.drawPath(rect, cPaint);
}
}
XML:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:id="#+id/linearLayout">
<TextView
android:id="#+id/Customfont"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/hello" />
</LinearLayout>
This is working for me and add the view in XML with full path and try giving wrapcontent for height and width.
public class RectangleView extends View {
public RectangleView(Context context) {
super(context);
}
public RectangleView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public RectangleView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
Paint paint = new Paint();
paint.setColor(Color.GRAY);
canvas.drawColor(Color.BLUE);
canvas.drawRect(10,10,50,50, paint);
}
}
I have created one view, view code is,
public class MyDraw extends View{
//List<Point> mArryLstpoints = new ArrayList<Point>();
Paint paint =new Paint();
Paint mPaintAlphabet = new Paint();
public MyDraw(Context context) {
super(context);
paint.setColor(Color.BLUE);
paint.setAntiAlias(true);
// TODO Auto-generated constructor stub
}
public MyDraw(Context context, AttributeSet attributeSet) {
super(context, attributeSet);
paint.setColor(Color.BLUE);
paint.setAntiAlias(true);
mPaintAlphabet.setDither(true);
mPaintAlphabet.setColor(0xFFFF0000);
mPaintAlphabet.setStyle(Paint.Style.STROKE);
mPaintAlphabet.setStrokeJoin(Paint.Join.ROUND);
mPaintAlphabet.setStrokeCap(Paint.Cap.ROUND);
mPaintAlphabet.setStrokeWidth(3);
mPaintAlphabet.setTextSize(400);
}
public void onDraw(Canvas canvas){
canvas.drawColor(Color.GRAY);
canvas.drawText("A",100,350, mPaintAlphabet);
System.out.println("in on draw");
for(Point mPoint:MyAlphabetsActivity.mArryLstpoints)
canvas.drawCircle(mPoint.x, mPoint.y, 12, paint);
}
}
I want use this view in layout and I want to set background images for the view. I am using following code,
<?xml version="1.0" encoding="utf-8"?>
<com.qteq.myalphabets.MyDraw
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/android:list"
android:layout_width="fill_parent"
android:layout_height="fill_parent" ></com.qteq.myalphabets.MyDraw>
My activity class is,
public class MyAlphabetsActivity extends Activity {
/** Called when the activity is first created. */
MyDraw mMyDraw;
Button mBtnOk;
AttributeSet attributeSet;
public static List<Point> mArryLstpoints = new ArrayList<Point>();
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
/*
* getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
* WindowManager.LayoutParams.FLAG_FULLSCREEN);
*/
/*
* mMyDraw=new MyDraw(this); setContentView(mMyDraw);
* mMyDraw.requestFocus();
*/
mMyDraw = (MyDraw) findViewById(R.id.mMyDraw_layout);
mMyDraw.bringToFront();
mMyDraw.requestFocus();
mMyDraw.setOnTouchListener(new OnTouchListener() {
#Override
public boolean onTouch(View v, MotionEvent event) {
// TODO Auto-generated method stub
Point mPoint=new Point();
mPoint.x=event.getX();
mPoint.y=event.getY();
System.out.println("in on touch");
mArryLstpoints.add(mPoint);
System.out.println("Array list is-----"+mArryLstpoints);
setContentView(R.layout.main);
return true;
}
});
// setContentView(R.layout.main);
}
}
class Point{
public float srtx;
float x, y;
#Override
public String toString() {
System.out.println("in on point");
return x + ", " + y;
}
}
and Displaying and onTouch Method called only one time.
You are Adding view with fill_parent width and height , so no space to add other views like buttons and images .
one of the possible implementation
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/android:list"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<com.qteq.myalphabets.MyDraw
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/android:list"
android:layout_width="fill_parent"
android:layout_height="wrap_contentt" ></com.qteq.myalphabets.MyDraw>
<Button/>
<ImageView/>
</LinearLayout>
Dont forget to add constructor
public MyDraw(Context context, AttributeSet attributeSet) {
super(context, ttributeSet);
in MyDraw.java
******** *editing* ******
in onTouch()
return super(v, event) instead of true ;
also check if you need to write setOnTouchListener() to view or canvas .
You can place your view within a layout in your XML and there can be other elements, as well, within that layout. You can set layout background to something, too.
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/android:list"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="#drawable/mybackground">
<com.qteq.myalphabets.MyDraw
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Button" />
</LinearLayout>
I use the following View to draw a bitmap and move it around.
public class DrawView extends View {
private ColorBall ball;
public DrawView(Context context) {
super(context);
setFocusable(true);
ball = new ColorBall(context,R.drawable.bol_groen, points);
}
#Override
protected void onDraw(Canvas canvas) {
canvas.drawBitmap(ball.getBitmap(), ball.getX(), ball.getY(), null);
}
public boolean onTouchEvent(MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
// do stuff...
}
}
In the starting Activity, the layout is set using setContentView(new DrawView(this));
I want add a button to the screen and when I click on the button, I want a new bitmap to be added. How do I add a button to this screen?
EDIT: This is my main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<Button android:text="Button"
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
</Button>
<com.example.DrawView
android:layout_width="fill_parent"
android:layout_height="fill_parent" />
</LinearLayout>
Set activity's layout from xml. Put there button and your custom view (you can make it GONE if you don't want it to be visible).
But before making it you should have one more constructor for your view
public DrawView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
setFocusable(true);
ball = new ColorBall(context,R.drawable.bol_groen, points);
}