How to create a layout like in picture in android? - android

I follow many blogs but didn't get the proper answer. Main problem is to create the circular progress which is showing with the help of some graphics. However not able to move towards success.
Path p = new Path();
p.moveTo(70, 10);
p.lineTo(25, 100);
p.lineTo(100, 50);
p.lineTo(0, 50);
p.lineTo(75, 100);
p.lineTo(50, 0);
// chk
// //complete code
ShapeDrawable progress1 = new ShapeDrawable(new ArcShape(180, -45));
progress1.setIntrinsicHeight(50);
progress1.setIntrinsicWidth(50);
progress1.getPaint().setColor(Color.BLUE);
progress1.getPaint().setStyle(Style.STROKE);
progress1.getPaint().setStrokeWidth(5);
ShapeDrawable progress2 = new ShapeDrawable(new ArcShape(0, 180));
progress2.setIntrinsicHeight(50);
progress2.setIntrinsicWidth(50);
progress2.getPaint().setARGB(50, 200, 54, 54);
progress2.getPaint().setStyle(Style.STROKE);
progress2.getPaint().setStrokeWidth(5);
iView.setImageDrawable(progress2);
iView1.setImageDrawable(progress1);

Without knowing which part you're stuck on, what you'd probably do is make a custom view where you define the drawing code in its onDraw method.
You can probably get away with drawing arced lines using a thick stroke in the corresponding target color. To make the ends of the arc rounded, configure the Paint object's properties to suit your needs, iirc the right method to use is Paint#setStrokeCap

Related

Android - how to properly draw an arrow with Path?

I'm trying to draw an arrow but I get a really strange result.
This is how it looks like and the problem is pretty clear - the overlapping part.
int radius = 100; //Radius of blue circle to the right
Path leftArrow = new Path();
Paint leftArrowPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
leftArrowPaint.setStyle(Paint.Style.STROKE);
leftArrowPaint.setColor(ContextCompat.getColor(getContext(), R.color.buttonText));
leftArrowPaint.setAlpha(80);
leftArrowPaint.setStrokeWidth(8);
Within onDraw method:
//Start point
leftArrow.moveTo(touchX-(radius+5), (int)touchY);
//Line to left
leftArrow.lineTo(touchX-(radius+60), (int)touchY);
//Line up
leftArrow.lineTo(touchX-(radius+30), (int)touchY-30);
//Move back to the middle
leftArrow.moveTo(touchX-(radius+60), (int)touchY);
//Line down
leftArrow.lineTo(touchX-(radius+30), (int)touchY+30);
canvas.drawPath(leftArrow, leftArrowPaint);
leftArrow.reset();
Ok, I know it's too late for you, but I'm gonna answer anyway in case someone comes across the same problem.
You need to specify the Paint's Join property.
https://developer.android.com/reference/android/graphics/Paint.Join.html
leftArrowPaint.setStrokeJoin(Paint.Join.BEVEL);
You can also use Paint.Join.ROUND, depending on what looks better for you.

Sprites attached to scene without intention

I have three TextureRegions that are created like this:
mBackgroundTextureRegion = BitmapTextureAtlasTextureRegionFactory.createFromAsset(mMenuTextureAtlas, pActivity, "menu_background.png", 0, 0);
mPlayBtnTextureRegion = BitmapTextureAtlasTextureRegionFactory.createFromAsset(mMenuTextureAtlas, pActivity, "play_btn.png", 50, 100);
mExitBtnTextureRegion = BitmapTextureAtlasTextureRegionFactory.createFromAsset(mMenuTextureAtlas, pActivity, "exit_btn.png", 50, 200);
I also have corresponding sprites for each TextureRegion which are created like this:
mBackgroundSprite = new Sprite(0, 0, mBackgroundTextureRegion, mBufferObjectManager);
mPlayBtnSprite = new Sprite(0, 0, mPlayBtnTextureRegion, mBufferObjectManager);
mExitBtnSprite = new Sprite(0, 0, mExitBtnTextureRegion, mBufferObjectManager);
When I attach mBackgroundSprite to a scene like this:
mScene.attachChild(mBackgroundSprite);
I would expect only mBackgroundTextureRegion to appear on the scene (i.e. "menu_background.png") but in reality all three TextureRegions appear (i.e. mPlayBtnTextureRegion and mExitBtnTextureRegion appear too in their location as well, (50,100) and (50,200) respectively).
My questions are:
A. Why does this happen? (does it have something to do with using the same Texture for all TextureRegions?)
B. What is the correct way to make only one TextureRegion appear on a scene?
No this has nothing to do with the texture atlas. This is the correct way of doing it more or less. Nothing should be shown on the screen unless they are attached as a child to something (scene or engine). If you need more straightforward help please upload the part of your code that you are loading the sprite.

Why NinePatch dont work in LibGDX?

I have a backround for message item, I want to make it stretched depending on the text. But when i make this:
Drawable drawableButtonMessageUp = new TextureRegionDrawable(new TextureRegion(new Texture("data/message_my_g.9.png")));
ButtonStyle buttonStyleMessage = new ButtonStyle();
buttonStyleMessage.up = drawableButtonMessageUp;
Button buttonMessage = new Button(buttonStyleMessage);
Label labelMessage = new Label("", new LabelStyle(game.fonts[0], new Color(0, 0, 0, 1)));
buttonMessage.add(labelMessage);
Background does not NinePath, it strached like a normal picture:
My result:
I want (example):
Backround for item:
I checked the nine patch picture in Android SDK, and this work good, how i can do this in libGDX?
It's because you're not using a NinePatch, you're using a TextureRegion
you probably are going to want to change the line
Drawable drawableButtonMessageUp = new TextureRegionDrawable(new TextureRegion(new Texture("data/message_my_g.9.png")));
to something like
Drawable drawableButtonMessageUp = new NinePatchDrawable(new NinePatch(new Texture("data/message_my_g.9.png"), 1, 1, 1, 1));
Note that the number "1" here is a placeholder. You may need to play around with those numbers to get the ninepatch to look right.
For more information, please take a look at the documentation, particularly the section on instantiating ninepatches

AndroidPlot: How to render a chart in an AppWidget?

I'm trying to use AndroidPlot to draw a chart in a homescreen widget.
I know that in a normal app, it uses a custom view and from what I've seen (Android: AppWidget with custom view not working), the workaround is to render this as a bitmap in an imageView.
Now I've taken the quickstart code for AndroidPlot and put it into the provider class but it doesn't seem to render anything when I drop it on the homescreen.
The difference between this code and the original quickstart code is that in the quickstart, it leverages the Activity.findViewById but obviously it can't be used here.
Can anyone see something here that I'm doing wrong that may be causing the empty rendering?
Appreciate any help you could provide!
private Bitmap getChartImage(Context context)
{
// initialize our XYPlot reference:
mySimpleXYPlot = new XYPlot(context, "My Simple XYPlot");
mySimpleXYPlot.setDrawingCacheEnabled(true);
// add a new series
mySimpleXYPlot.addSeries(new SimpleXYSeries(), LineAndPointRenderer.class, new LineAndPointFormatter(Color.rgb(0, 200, 0), Color.rgb(200, 0, 0)));
// reduce the number of range labels
mySimpleXYPlot.getGraphWidget().setRangeTicksPerLabel(4);
// reposition the domain label to look a little cleaner:
Widget domainLabelWidget = mySimpleXYPlot.getDomainLabelWidget();
mySimpleXYPlot.position(domainLabelWidget, // the widget to position
45, // x position value, in this case 45 pixels
XLayoutStyle.ABSOLUTE_FROM_LEFT, // how the x position value is applied, in this case from the left
0, // y position value
YLayoutStyle.ABSOLUTE_FROM_BOTTOM, // how the y position is applied, in this case from the bottom
AnchorPosition.LEFT_BOTTOM); // point to use as the origin of the widget being positioned
// get rid of the visual aids for positioning:
mySimpleXYPlot.disableAllMarkup();
//mySimpleXYPlot.measure(150, 150);
//mySimpleXYPlot.layout(0, 0, 150, 150);
Bitmap bmp = mySimpleXYPlot.getDrawingCache();
return bmp;
}
Have you stepped through to see if the bitmap is actually empty? My guess is that the Bitmap is fine and the problem exists outside of this chunk of code. Take a look at this example usage of a widget with AndroidPlot - it's super minimal and it definitely works. Hopefully there's a solution in there for you :)
Nick

trouble in making a game questions?

all i've a little trouble understanding some concepts while making game please give your suggestions on my questions.
I have a animated sprite image this i want to move this image according to given path. I can get path from
Path path = new Path();
Point s = new Point(150, 5);
Point cp1 = new Point(140, 125);
Point cp2 = new Point(145, 150);
Point e = new Point(200, 250);
path.moveTo(s.x, s.y);
path.cubicTo(cp1.x, cp1.y, cp2.x, cp2.y, e.x, e.y);
canvas.drawPath(path, paint);
these points are hard coded and give different results on different screen.
Q1. How can i make path which is similar in all screen size?
Q2. How can i move my animated sprite image according to given path with the image has it's head according to path?

Categories

Resources