I have four ImageViews in a layout. I set the maximum width for each one of them by setMaxWidth function. The problem is that they keep a small distance between them and I don't want that. If I don't stipulate the maximum width, these gaps disappear, but the ImageViews sizes are inappropriate (bigger than it should be).
The main code is:
musicSubmenuButton = new ImageView(context);
musicSubmenuButton.setId(id++);
musicSubmenuButton.setImageResource(R.drawable.bt_musicas_on);
musicSubmenuButton.setMaxWidth(buttonSize);
musicSubmenuButton.setAdjustViewBounds(true);
photosSubmenuButton = new ImageView(context);
photosSubmenuButton.setId(id++);
photosSubmenuButton.setImageResource(R.drawable.bt_fotos_off);
photosSubmenuButton.setMaxWidth(buttonSize);
photosSubmenuButton.setAdjustViewBounds(true);
agendaSubmenuButton = new ImageView(context);
agendaSubmenuButton.setId(id++);
agendaSubmenuButton.setImageResource(R.drawable.bt_agenda_off);
agendaSubmenuButton.setMaxWidth(buttonSize);
agendaSubmenuButton.setAdjustViewBounds(true);
infoSubmenuButton = new ImageView(context);
infoSubmenuButton.setId(id++);
infoSubmenuButton.setImageResource(R.drawable.bt_info_off);
infoSubmenuButton.setMaxWidth(buttonSize);
infoSubmenuButton.setAdjustViewBounds(true);
The size I wanted, but without the gaps (obtained using the above code):
The ImageViews without the gaps, but in the original resolution (obtained using the above code, but commenting the setAdjustViewBounds calls):
Does anybody know why these gaps appear and/or a workaround to get rid of these gaps and keep my desired size?
Instead of setting max width, set layout_width on them to fill_parent. Then they will space out evenly.
Related
I'm using the following method which programatically creates a linearlayout and populates it with two textviews, adds text and then turns it into a drawable that I later use a layer above a shape. However, I've noticed that I can't create a small fontsize - it seems stuck at a minimum size which is relatively.. large, and anything that I specify below that value just seems to make it look increasingly blurry (but still the same size). What could be the reason for this?
This behavior occurs whether or not I used TypedValue.COMPLEX_UNIT_SP.
Edit: This size stays the same even if I specify something ridiculous like:
.setTextSize(TypedValue.COMPLEX_UNIT_SP, 60);
it doesn't get any bigger - it just gets "sharper".
Edit 2: If I specify the top textview as having a very large size, then the smaller I set the second textview, the smaller it becomes - as a ratio (for example, if I set the top at 100 and the bottom at 50 it looks exactly the same as the top at 10 and the bottom at 5). However, in no way can I reduce the size of the top textview.
Edit 3: If I remove one of the textviews, and leave only the other one as a single textview in the layout - I can't change the size at all. I can only make it more or less blurry depending how low I set the number but it will always appear the exact same size on screen.
private Drawable createTextLayer() {
LinearLayout newLinearLayout = new LinearLayout(getContext());
newLinearLayout.setOrientation(LinearLayout.VERTICAL);
newLinearLayout.setGravity(Gravity.CENTER);
LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.MATCH_PARENT);
newLinearLayout.setBackgroundColor(getColor(R.color.somecolor));
newLinearLayout.setLayoutParams(layoutParams);
TextView headlinetv = new TextView(getContext());
TextView bodytv = new TextView(getContext());
headlinetv.setText(headlineText);
headlinetv.setTextSize(7);
headlinetv.setGravity(Gravity.CENTER);
bodytv.setText(bodyText);
bodytv.setTextSize(6);
bodytv.setGravity(Gravity.CENTER);
newLinearLayout.addView(headlinetv);
newLinearLayout.addView(bodytv);
newLinearLayout.setDrawingCacheEnabled(true);
newLinearLayout.measure(MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED),
MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED));
newLinearLayout.layout(0, 0, newLinearLayout.getMeasuredWidth(), newLinearLayout.getMeasuredHeight());
newLinearLayout.buildDrawingCache(true);
Bitmap b = Bitmap.createBitmap(newLinearLayout.getDrawingCache());
newLinearLayout.setDrawingCacheEnabled(false);
return new BitmapDrawable(getResources(), b);
}
Change your code to:
textView.setTextSize(TypedValue.COMPLEX_UNIT_SP, 7);
Change the font size of 7 to any font size as you wish.
This turned out to be quite tricky and took me several hours to solve, but I'm posting the answer for anyone else who ends up in a similar situation.
The cause:
The entire drawable layer was the uppermost layer above a shape, and was therefore stretched to the size of the shape no matter what. In order to stretch it to the size of the shape, the largest view was stretched (essentially, the longest textview) and therefore couldn't be enlarged or reduced in size.
The solution:
I defined two more textviews, gave them the longest string by 1 character, and made the textcolor transparent. I would have preferred to give them blank space as content but android refused to measure a textview containing whitespace, so it had to be actual text. I put one textview at the top and one at the bottom and thus the visible text appears perfectly centered and in the correct font size.
Edit:
There turns out to be a better way of doing this. Define the textview as the same size as the shape on which it sits as a layer and define padding around the textview (play around with it to find the minimal amount of padding needed). If you have several textviews, divide the size of the shape by the number of textviews and give each one a fraction.
I have 2 bitmaps that I saved with view.getDrawingCache(); called firstBitmap and secondBitmap. They were saved from initial drawings made by the user. Now I want to display them. My issue is that only the first picture is displayed by itself (I want both to be shown at the same time). I know that the bitmaps are correct because if I remove layout.addView(pic1), I can see the second image by itself clearly. layout is a LinearLayout.
My suspicion is that the size is an issue but I believe that by default views that are added to the layout have fill parent so this should still result in 2 images not one. I have tried dynamically changing the width and size with LayoutParams but this makes the image disappear entirely. I am open to any suggestions.
ImageView pic1 = new ImageView(this);
pic1.setImageBitmap(firstBitmap);
layout.addView(pic1);
ImageView pic2 = new ImageView(this);
pic2.setImageBitmap(secondBitmap);
layout.addView(pic2);
Try to distribute the weight in your linear layout so that both bitmaps will be visible.
you could use the below code to do that.
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(width, height, weight);
layout.addView(pic1, params);
layout.addView(pic2, params);
I have a Horizontal Scroll View, and inside it i have a ImageView. This imageview has a Bitmap with high width and low height.
I want the bitmap to fill the height of the horizontal scrollview, and I want to scroll the bitmap from left to right.
I tried to use this code, but it doesn't work. It creates two spaces on left and right, these spaces are black. These spaces are from the ImageView... so... the bitmap has less width than the ImageView
HorizontalScrollView wvScroll = new HorizontalScrollView(this);
wvScroll.setLayoutParams(new LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT));
iv.setImageBitmap(Util.getRemoteImage("http://mywebsite.com/90.gif"));
//iv.setLayoutParams(new LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT));
iv.setScaleType(ScaleType.CENTER_INSIDE);
iv.setBackgroundColor(Color.BLACK);
wvScroll.addView(iv);
wvScroll.setBackgroundColor(Color.GREEN);
mainLayout.addView(wvScroll);
what am i doing wrong? I also tryed with iv.setLayoutParams(new LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT)); but it doesn't works, Same result.
EDIT:
I also tryed with ScaleType.CENTER_CROP and it doesn't works fine. The bitmap has higher height than the ImageView, because some pixels lost on top and bottom of the bitmap.
If I had to approach this in the simplest way. I'd set the width of the scroll view the same as the screen width. The height doesn't matter as much because you're assuming the height will fit in the screen(At least that's what I gather from your question).
From what I remember scroll-views will scroll anything bigger than than the actual screen or anything that is bigger than the specified scroll-width or scroll-height its given.
This might help you get started with getting the respectable screen sizes - Get Screen width and height
Of course since different devices have different screen sizes - you'd have to do this "pro-grammatically".
Would this sort of implementation work for you?
So I have this task to create a horizontal scrolling array of image buttons that are basically photo avatars of users. These avatars aren't constrained by aspect ratio or size, and so I've been playing with ways to scale them and format them. I've gotten them scaling via the scaletype="fitCenter" and using static width and height. But what I really want them to do is to butt up against one another. Currently if an image is taller than it is high, you get the kind of letterboxing but on the sides vs. the top (blank areas). I've tried all the different scaling values, wrapping each imagemap within a linearlayout, etc., but nothing I try seems to get rid of those (while displaying the entire image to scale). Is there any way to do this?
Just to reiterate what I think you're doing, you have three image scenarios:
Square image
Landscape image (wider than tall)
Portrait image (taller than wide)
Laying out a row of fixed-size ImageViews (or ImageButtons) using FIT_CENTER works great for what you need if all the images were either square or landscape, because the scaling will always make the image stretch to the horizontal bounds of the view (the largest dimension). However, with portrait images, the scaling causes the view to be inside the bounds of your fixed-size view so that the entire image height can be visible.
If you need to maintain the aspect ratio of the image, there really is no ScaleType to help with this because the logic would be circular (fit the view to the image, while simultaneously fitting the image to the view). The solution is to adjust the size (specifically, the width) of each ImageView to match what the image will be scaled to. Here's a sample of a factory method you might use to generate the ImageView to fit the image you want to put inside it. You could also modify this slightly to reset parameters on an existing ImageView if you like:
private ImageView getImageViewForThumbnail(Bitmap thumbnail) {
float viewHeight = //Your chosen fixed view height
float scale = ((float)thumbnail.getHeight()) / viewHeight;
float viewWidth = thumbnail.getHeight() / scale;
ImageView view = new ImageView(this);
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams((int)viewWidth, (int)viewHeight);
view.setLayoutParams(params);
view.setScaleType(ScaleType.FIT_XY);
view.setImageBitmap(thumbnail);
return view;
}
You're basically just calculating what the aspect width of the ImageView should be to match the fixed height you've chosen for all of them.
HTH
Use the scaleType fitXY, it stretches the image to the layout params you assigned, if the image has less dimensions and also shrinks the image to the layout params you assigned, if the image is large. The key point is to mention the image layout params to the imageView , that is the width and height of the image.
Hy!
I download a picture from the internet and want to display it. The height should be 1/6 of the max screen height (for multi phone support)
Code:
final ImageView iv = (ImageView) findViewById(R.id.ImageView01);
iv.setMaxHeight(getWindowManager().getDefaultDisplay().getHeight()/6);
Please help!
Try using the layout_weight attribute of LinearLayout to divide the screen into the parts you need. The ratio of the values you set to the different parts makes the parts become bigger or smaller.