This is the scenario:
I have one image background set on an activity. On this background, a rectangle has been drawn (in other words, one image depicting a rectangle). I need to display text WITHIN this rectangle.
Right now, I have one solution in mind: since I'm going to optimize the UI for most screens (incl. tablets), I'm going to customize the main .xml layout for each screen size (multiple .xml layouts). Thus, I can manually set the place where the text area goes within the rectangle (+ its size).
I am most certain that this solution is NOT good. I'd like to hear some suggestions from more advanced developers. What would an elegant way of placing text over a background image showing a rectangle, so that the text stays within the rectangle's borders be?
Because I need to set particular positions for other UI elements (centered buttons (vertically/horizontally), I am currently using a Relative Layout.
By default if you have used dp as dimensional measure, your app should in theory work fine for all resoultions. Android by default scales the screen to fit different screens. AndroidDeveloper You just have to make sure that you have different images for resources (Rectangle image). There is another post in SO which you might be intrested to look into link
Cheers
RIchie
Related
I'm making a minesweeper app in AndroidStudio, and have a layout which I dynamically add the buttons to. I have tried multiple layouts and button types, which have all given me the same problem. I have created 9-patch images for the different background states:
which I set for each button using btn.setBackgroundResource(R.drawable.btn_up).
This all works fine normally, however if the buttons are made too small or there are too many of them, the screen displays strange glitch shapes. The glitch is made worse the larger the number of buttons, and the smaller the size of the buttons. The images below show respectively: small buttons/big grid; slightly bigger buttons; using the red 9-patch as the default background.
This is fixed by using normal png images but I would quite like to use the scalable 9-patch ones. Clicking the buttons changes the glitch shapes, tending to improve the visibility. I have tried simplifying the layout, and I am sure nothing else is affecting it - it is as simple as I've stated. The glitch shapes seem to originate in the top-left corner, and contain the colour of the 9-patch image, as you can see in the screenshots.
Does anyone have any idea why this is happening or how to fix it?
I want to create an illusion of a moving road or path.
For fun, I was thinking about how this could be done:
draw the whole path out in an image and simply have the image scroll across the screen - this would be annoying to manually draw and eliminates the ability to have a random path.
generate a pixel thin line equal the to width of the path at the top of the screen and simply move the line down the screen to have it scroll. And constantly generate new lines at the top in a slightly different location.
This is all I could come up with, I'm sure there are much better ways. How would y'all do it?
What about making a queue which stores the path with a maximum size. And then you just redraw it when it gets updated.
I think drawing the line again is comparable to drawing a full screen image in performance concerns. Furthermore it will take less memory.
I'm new to LIBGDX game development, and I have faced my first problem. I've created 9.patch drawables (buttons) using texture packer. This drawables can be used on low density and also extra high density screens and quality is the same.
If I run my project with that drawable on desktop project the image shown is okay and perfect size. If I run project on low density android device, drawable becomes huge (almost half of the screen). And also If I run project on extra high density android device the button becomes really small.
So my question is, how to handle drawables in LIBGDX, so the ratio (screen:image size), stays the same no matter resolution/density..?
If your button is a text button. Change the font of your text.
If you are using image button, this might help you
It kind of depends on what you're drawing...If you are just drawing an image, I've found it easier to specify a float width and height in the last 2 parameters of the draw method. If you are using a camera with a fixed viewport size, you can simply use a fixed percentage of your camera viewport so it will always be the same dimensions and draw like this:
batch.draw(drawable,x,y,screenwidth * 0.5f,screenheight*0.5f);
However, if you are using buttons or some other widget inside of a table, you should specify the cell size and it should automatically be resized based on the size of the table cell. Something like:
myTable.add(myWidget).width(300).height(200);
Post up exactly what it is that you need to draw if you get a chance and it will be easier to figure out what needs to happen.
I have made a program that uses null, border, card and some my custom layouts. The window of the program is set to resizable:false. Now I wan't to make full screen mode for my program but the problem is that GUI looks ugly if the size of the screen isn't the one I set. I could implement some kind of scale factor for all the components but the problem is that I have over 2000 components in over 50 classes.
Is there an option to resize whole swing UI for defined factor? That means that the image rendered as UI and all mouse events aswell would be resized.
You should probably try to rely on your layout managers. Try to figure out specifically which layouts aren't resizing the way you want, and focus on correcting their behavior instead of trying to manage everything from the top down.
Alternatively, you could keep the size ratio by adding black bars to the top and bottom or left and right of the window when it's in full screen mode. You'll probably still have to play with some of the layouts to get them perfect though.
Having 2000 different components sounds like a usability nightmare, but that's a different issue.
I asked a question about this earlier but received no responses, so I'm trying again.
I need to do a rendered 2D picture with some accompanying labels and graphics on a Motorola Xoom, Android 3.0. Although what I need can be done with just a SurfaceView (Canvas) or just a GLSurfaceView, I would really like to use both because the rendering is faster with the GLSurfaceView, and the labeling and graphics are easier with the SurfaceView. The visual layout is as shown below.
I tried to put the SurfaceView on top by declaring it in the layout XML after the GLSurfaceView. The SurfaceView is transparent (except for where I explicitly draw stuff) so that the GLSurfaceView can still be seen.
This approach has worked pretty well with one huge exception. Anything that I draw on the SurfaceView that is in the GLSurfaceView region does not show up at all. To verify this I drew some text that was right on the boundary (some in the shared region, some just in the SurfaceView region), and it was chopped off at the GLSurfaceView boundary. I have tried using the "bringToFront" method to fix this, but it hasn't worked.
Can anyone give me some ideas on why this isn't working or what I can do about it? Is it that the GLSurfaceView is in front, or is that the GLSurfaceView writes directly to the video memory, so it doesn't matter if something is in front of it?
The way SurfaceViews work will make it impossible to do what you want. You will have to render your text inside the GLSurfaceView.
Never try to overlap a GLSurfaceView with anything (above or below). At best it breaks on your device and you catch it early, at worst it works on one device and not others. Bite the bullet and do everything in a GL view or none of it. If you need the speed then GL is the way to go.
we should set setZOrderMediaOverlay and setZOrderOnTop to true value
setZOrderMediaOverlay
Added in API level 5
void setZOrderMediaOverlay (boolean isMediaOverlay)
Control whether the surface view's surface is placed on top of another regular surface view in the window (but still behind the window itself). This is typically used to place overlays on top of an underlying media surface view.
Note that this must be set before the surface view's containing window is attached to the window manager.
Calling this overrides any previous call to setZOrderOnTop(boolean).
setZOrderOnTop
Added in API level 5
void setZOrderOnTop (boolean onTop)
Control whether the surface view's surface is placed on top of its window. Normally it is placed behind the window, to allow it to (for the most part) appear to composite with the views in the hierarchy. By setting this, you cause it to be placed above the window. This means that none of the contents of the window this SurfaceView is in will be visible on top of its surface.
Note that this must be set before the surface view's containing window is attached to the window manager.
Calling this overrides any previous call to setZOrderMediaOverlay(boolean).
Please refer to this link :
http://developer.android.com/reference/android/view/SurfaceView.html#setZOrderMediaOverlay(boolean)