I have two buttons positioned horizontally next to each other and want to limit the width of the buttons when the screen resolution goes up. For mdpi, the two buttons should be equal length and take up the entire width of the screen. If you then switch to a higher resolution, the two buttons can grow in width if necessary but only up to a maximum width of say 100dp. I have not been successful in accomplishing this. The two buttons end up being the same size but they fill the entire width of the screen. I have tried putting the buttons in a table, in just a LinearLayout and have tried using the maxWidth on various combinations but to no avail. If I use a table, I have tried stretching the columns and not stretching them. That didn't help either. Any suggestions?
You say you've tried maxWidth...but you don't show any examples of what you tried, so here's my suggestion, which I'm nearly certain should work for you:
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:maxWidth="100dp"
android:text="Button 1"
/>
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:maxWidth="100dp"
android:text="Button 2"
/>
</LinearLayout>
You haven't put your xml view here. How can we find an error?
Probably, you have used background image and width set to wrapcontent ? Change the source image size to smth small
You can try creating different layouts for different resolutions. This is not the best way of solving your problem, but this will surely work. Good luck!
Related
I'm asking this (propably) pretty easy question since I can't figure it out by myself and googling in for more then an Hour doesn't give me proper results.
So the question is: How can I make my items(generally those are only 16 image buttons) so they can stay in scale (comparing to gridlayout) when my picture is really large (So in short way: I load 16xImages as src on buttonImages, each Image is 640x640, and I want to have those 16 buttons in grid layout scaled comparing to grid layout width/height and column/row count). I hope this is possible to write in XML since I don't want to refactor my java code :/
Ps. I'm newbie to Android programmig
Ps2.Here is my GridLayout with button example , but it's completly wrong :/
<GridLayout
android:id="#+id/GridLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:columnCount="4"
android:rowCount="4"
tools:context=".GridXMLActivity"
android:layout_below="#+id/Tx1"
android:layout_above="#+id/restart"
android:layout_marginBottom="50sp"
android:layout_marginTop="50sp"
>
<ImageButton
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/transparent"
android:src="#drawable/clear"
android:id="#+id/But1"
android:scaleType="fitXY"
android:onClick="but1"
/>
[EDIT]
I've even made such layout , but there are some problems. 1st is that my grid layout doesn't scale at all!(So when I take screen with lower or higher resolution it won't fit). That's why I wanted to make this button some kind of resizeable (in this screen each button has width and height at 60sp which I know it shouldn't)
Another problem is that I'm working on button backgrounds and I wanted to make it src.
Genereally I want to achive same thing like on the screen , but making it other/more flexible way (So the resolution and orientation won't affect my gui and sizes of it's element). If you need whole XML file I'll post it here but it's a bit mess since I've copy-paste 16 times Image Button
If you want something to scale, keeping aspect ratio and you have one dimension set to match_parent, the other must be wrap_content.
So, presuming you want the button to always fit the width but stay at the correct aspect:
<ImageButton
android:layout_width="match_parent"
android:layout_height="wrap_content"
... />
To make all items fit in grid rather than all items fit their images, you should use weight. Weight with grid layout requires the support library before API21
<GridLayout ...
android:columnCount="2">
<ImageButton
app:layout_gravity="fill"
app:layout_columnWeight="1"
android:layout_width="0dp"
android:layout_height="wrap_content"
... />
...
I'm just starting out with android and trying to make a simple user interface.
I'm using TableLayout and each TableRow is supposed to contain an image and several buttons next to it. I set the width and height of the buttons to wrap_content, which is exactly what I want. Now I want the image to have exactly the same height as the buttons. The image is way bigger, so wrap_content doesn't work.
Obviously I can just adjust the dp value of the image height until it fits, but there has to be an easier way and I guess that pretty much defeats the purpose of using wrap_content in the first place...
Set the height of the image to match_parent. Your buttons are doing all the height-sizing work having the wrap_content set. When the row gets sized it uses the button height, as they say "you will be as tall as our content", and then when the image is going to be sized, it will use the available height, as specified before by the buttons. Even if the buttons are smaller than the image, the image will still take the available space.
Try this
<TableLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TableRow
android:id="#+id/tableRow1"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="match_parent" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</TableRow>
</TableLayout>
I'm developing an Android app using fragments. In two fragments I use a TableLayout to programmatically create a matrix view consisting of buttons. The dimension of the matrix differs for different runs of the app, but typically I have 10-15 rows and 10-15 columns.
I have OddsButton extend Button.
I would like to have this view fill the screen on different devices, but I haven't been able to understand what is the right approach. I can (by hardcoding values for width and height) impact the height and width of the buttons (see below for code), but I'm struggling with fitting it to a Nexus 7 anyway. If I first find the right height to use to make it fit the screen then when I start adding more width the buttons get a bit higher as well and there is no way for me to adjust that back.
Sorry if this question is strange, but I hope that someone can make sense of this. I realize that I might be trying the totally wrong approach for this.
for (int k=1;k<=n2;k=k+1){
OddsButton b = new OddsButton(this.getActivity());
b.setLeg1(no);
b.setLeg2(k);
b.setO(this.getO(no,k));
b.setIndex(this.IndexForCombination(no, k));
b.setMinimumHeight(height);
b.setHeight(height);
b.setMinimumWidth(width);
b.setMinimumHeight(width);
b.setPadding(0, 0, 0, 0);
Table Layout is a bit tricky. Please have a look at the example:
<TableLayout
android:id="#+id/myId"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:stretchColumns="*"
android:weightSum="2"
>
<TableRow >
<TextView
android:id="#+id/text1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="bla1"
/>
<TextView
android:id="#+id/text2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="bla2"
/>
</TableRow>
</TableLayout
What is tricky is to first set android:stretchColumns="*" for layout (means stretch all columns) and next android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" (don't ask me why it wors like that, I will never understand some tricky things in Android, but good they work). Btw, weightSum is simply the sum of weight of elements you want to have in one row.
Sure you can have more tablerows, just the number of elements in each should be the same.
(P.S. please don't forget to give points if you like the answer ;)).
This question already has answers here:
Closed 11 years ago.
Possible Duplicate:
how do i keep the aspect ratio on image buttons in android?
i have 5 square dice as image buttons lined up near the bottom of my layout. i would like them to take up the whole width of the layout, but i can't seem to get them to properly keep that aspect ratio, while taking up the entire width.
currently my code looks like this:
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="60dp"
android:layout_margin="1dp"
android:layout_gravity="bottom"
>
<ImageButton
android:id="#+id/die1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:adjustViewBounds="true"
android:layout_weight="1"
android:layout_margin="2dp"
android:scaleType="centerInside"
/>
<ImageButton
android:id="#+id/die2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:adjustViewBounds="true"
android:layout_weight="1"
android:layout_margin="2dp"
android:scaleType="centerInside"
/> .....
and looks something like this:
if i don't include the
android:layout_height="60dp"
then the dice become skewed and look like this:
however the problem with leaving the "60dp" part in arises when i try to display on a tablet device or something with a high resolution it ends up looking like this:
where am i going wrong?!
You're going to have to do 1 of two things:
1) Provide ldpi, mdpi, hdpi and x-hdpi versions of your dice images. Put those in their respective drawable folder and android will take care of the rest.
Find out how here: http://developer.android.com/guide/practices/screens_support.html
Or
2) Get the screen size and set the imageview sizes manually java. You can get the screen size using:
Display d = ((android.view.WindowManager) getSystemService(Context.WINDOW_SERVICE)).getDefaultDisplay();
screenWidth = d.getWidth();
The rest is up to you. Good luck!
-edit-
Setting ImageView (or any other View's size in Java)
myHeight = screenSize/5; //These are in pixels not dp's
myWidth = screenSize/5;
LinearLayout.LayoutParams myLayoutParams =
new LinearLayout.LayoutParams(myWidth,myHeight);
myView.setLayoutParams(myLayoutParams);
Hope it fares well.
try
android:layout_height="wrap_content"
&
<LinearLayout> attribite is android:layout_height="60dp" replace with android:layout_height="wrap_content"
Set the width of the ImageButtons to fill_parent and use scaletype fitStart for the images that hug the left margin, and fitEnd for the ones on the right. Should do the trick, at least as far as your example image goes. You may have some spacing issues if the proportional width of the images exceed the screen width, but it should work for you.
In my application I have a layout with 3 image views with different heights (apple, wine, fish), bottom aligned. The layout height is constant. This layout looks good on hdpi screens, but I want to use the same images on mdpi. The problem is that on mdpi some of the image views might be down scaled and the proportion between the image views won't be the same. So, if the wine is down scaled, the apple might be tall as the wine bottle. What is the best way to avoid this? I thought about setting the same height for the images (the largest height), at run time. Then, they will all be scaled, and the proportion will be kept. Is this posible. I hope this is clear. Thank you.
Just set:
android:scaleType="fitCenter"
on each of the ImageViews. They'll resize to fit proportionally no matter what the height.
EDIT: To clarify the weighting issue, let's say you have the three images (fish, apple, bottle), we'll call them F, A, and B.
Let's say we know that:
F should be 2x as tall as A. A
should be half as tall as B.
So we know that F should be the same height as B, while A should be half the height of B. We can give F and B equal weights (1), and A a weight of half (0.5). To simplify, we can multiply by 2 to give integers, so F and B have a weight of 2, A has a weight of 1. This way, no matter what height you set the LinearLayout to be, the images should remain proportional to each other.
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="200dp"
android:orientation="vertical"
>
<ImageView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="2"
android:src="#drawable/fish"
android:scaleType="fitCenter"
/>
<ImageView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:src="#drawable/apple"
android:scaleType="fitCenter"
/>
<ImageView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="2"
android:src="#drawable/bottle"
android:scaleType="fitCenter"
/>
</LinearLayout>
I believe this is what you're asking for, but I may be mistaken still.