How to Increase the size of Image View in Android - java

I am working on a project that requires me to implement two horizontal scroll views with an image view in between them. I would like to extend the size of the image view to fill up the gap in between the scroll view. I went through the sample code, but it doesn't seem to mention anywhere in the size of the image view. I've enclosed the code below after the Image describing my problem.
public class Gallery2DemoActivity extends Activity {
private Gallery gallery,gallery1;
private ImageView imgView;
private Integer[] Imgid = {
R.drawable.a_1, R.drawable.a_2, R.drawable.a_3, R.drawable.a_4, R.drawable.a_5, R.drawable.a_6, R.drawable.a_7
};
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
gallery = (Gallery) findViewById(R.id.examplegallery);
gallery.setAdapter(new AddImgAdp(this));
gallery1 = (Gallery)findViewById(R.id.examplegallery1);
gallery1.setAdapter(new AddImgAdp(this));
imgView = (ImageView)findViewById(R.id.ImageView01);
imgView.setImageResource(Imgid[0]);
gallery.setOnItemClickListener(new OnItemClickListener() {
public void onItemClick(AdapterView parent, View v, int position, long id) {
imgView.setImageResource(Imgid[position]);
}
});
}
public class AddImgAdp extends BaseAdapter {
int GalItemBg;
private Context cont;
public AddImgAdp(Context c) {
cont = c;
TypedArray typArray = obtainStyledAttributes(R.styleable.GalleryTheme);
GalItemBg = typArray.getResourceId(R.styleable.GalleryTheme_android_galleryItemBackground, 0);
typArray.recycle();
}
public int getCount() {
return Imgid.length;
}
public Object getItem(int position) {
return position;
}
public long getItemId(int position) {
return position;
}
public View getView(int position, View convertView, ViewGroup parent) {
ImageView imgView = new ImageView(cont);
imgView.setImageResource(Imgid[position]);
imgView.setLayoutParams(new Gallery.LayoutParams(110, 100));
imgView.setScaleType(ImageView.ScaleType.FIT_XY);
imgView.setBackgroundResource(GalItemBg);
return imgView;
}
}
This is my XML main file.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/LinearLayout01"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<Gallery
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/examplegallery"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
<ImageView
android:id="#+id/ImageView01"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"/>
<Gallery
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/examplegallery1"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
</LinearLayout>
Below is my Attributes file:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="GalleryTheme">
<attr name="android:galleryItemBackground" />
</declare-styleable>
</resources>

Vinner,
The issue here is really two issues:
The size of the ImageView is based on the parent, which means that it shares its width and height.
The Image is resized to match the most limiting dimension (width).
The easiest way to handle this is to set the ScaleType of the ImageView. There are a number of Scaling Types, but the one you probably want is Center Crop. In code, this is done by view_name.setScaleType(ImageView.ScaleType.CENTER_CROP). You may also do this in XML for your ImageView with the attribute android:scaleType="centerCrop". Mind you, this will resize your Image and maintain your aspect ratio, but it will cut off the sides.
Just add the above attribute to your ImageView in your XML, (probably under your layout_weight), and it should do what you want.
Hope this helps,
FuzzicalLogic

will you try below code... ?
?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/LinearLayout01"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<Gallery
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/examplegallery"
android:layout_width="fill_parent"
android:layout_height="wrap_content" android:layout_weight="1" />
<ImageView
android:id="#+id/ImageView01"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:src="#drawable/ic_launcher"
android:layout_weight="1"/>
<Gallery
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/examplegallery1"
android:layout_width="fill_parent"
android:layout_height="wrap_content" android:layout_weight="1"/>
</LinearLayout>
and if it do not work, try setting your gallery height to some dp, it will work.. Thanks

The size of the ImageView is based on the parent, which means that it shares its width and height. Also, the Image is resized to match the most limiting dimension (width).

It looks like in the AddImgAdp class, you set the ImageView's height and width to specific pixel sizes.
imgView.setLayoutParams(new Gallery.LayoutParams(110, 100)); //width = "110px", height="100px"
I personally would put the layout as a RelativeLayout, align the first gallery with the top, the second gallery with the bottom, nd have the ImageView set to align above the second gallery. Then make the image:
imgView.setLayoutParams( new Gallery.LayoutParams(
Gallery.LayoutParams.FILL_PARENT,
Gallery.LayoutParams.FILL_PARENT) );
If you set the ImageView to fill_parent with a LinearLayout, it will fill to the bottom of the screen and the second gallery will be off the screen.
Also know that by filling in all the space you will most likely distort the picture. Consider all of your resizing options: http://developer.android.com/reference/android/widget/ImageView.ScaleType.html

Related

Make a Recyclerview of 9 items with GridLayoutManager fit the screen

I have a Grid that was generated by a RecyclerView and GridLayoutManager , so in my case I will always have only 9 items on the Grid, so I want them to fill the entire screen. Below is how they look on my screen:
This is the activity_main.xml :
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/rv"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
</RelativeLayout>
then, the single_item.xml is :
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="120dp"
android:padding="1dp"
>
<ImageView
android:id="#+id/image_item"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitXY"
/>
</RelativeLayout>
How I attached the Gridlayoutmanager :
rv = findViewById(R.id.rv);
ImageAdapter imageAdapter = new ImageAdapter(allBitmaps, MainActivity.this);
mLayoutManager = new GridLayoutManager(MainActivity.this, 3);
rv.setLayoutManager(mLayoutManager);
rv.setAdapter(imageAdapter);
So I want the grids to fit well the entire screen, how best can this be done ?
Here is the scenario:
Measure the width & height of the RecycerView before attaching the adapter to it:
Get the desired RecyclerView item width & height by dividing the width & height of the previous step by 3; as you have 3 items horizontally and vertically.
Pass the item width & height to the RecyclerView adapter as parameters and store them as fields.
In activity onCreate():
recyclerView.getViewTreeObserver().addOnPreDrawListener(new ViewTreeObserver.OnPreDrawListener() {
#Override
public boolean onPreDraw() {
if (recyclerView.getViewTreeObserver().isAlive())
recyclerView.getViewTreeObserver().removeOnPreDrawListener(this);
float width = (float) recyclerView.getWidth() / 3;
float height = (float) recyclerView.getHeight() / 3;
ImageAdapter adapter = new ImageAdapter(context, width, height, allBitmaps);
recyclerView.setAdapter(adapter);
return true;
}
});
Set the ImageView width & height in the ViewHolder:
class ViewHolder extends RecyclerView.ViewHolder {
ImageView image;
public ViewHolder(#NonNull View itemView) {
super(itemView);
image = itemView.findViewById(R.id.image);
image.getLayoutParams().width = (int) itemWidth;
image.getLayoutParams().height = (int) itemHeight;
}
}
I tested this with just an ImageView as a list item layout:
<?xml version="1.0" encoding="utf-8"?>
<ImageView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="fitXY" />
Portrait preview:
Landscape preview:
I think if you want those images to fill up the screen, you need to modify the width and height of the image inside your single item.xml

Center crop dont work in gridlayoutmaneger Android

I have grid view which is using GridLayoutManager and the RecyclerView
grid has 3 rows which are working fine as you see,[![enter image description here][1]][1]
but for some reason, image views scale type won't work on any of the items and those items you see work fine because the resolution already is square mean 512*512 but if you see the last item that has low resolution it have white space in left and right.
that's my code from a setup list
int getori = getResources().getConfiguration().orientation;
if (getori == Configuration.ORIENTATION_PORTRAIT) {
gl = new GridLayoutManager(getBaseContext(), 3);
} else if (getori == Configuration.ORIENTATION_LANDSCAPE){
gl = new GridLayoutManager(getBaseContext(), 6);
}
gg.setHasFixedSize(true);
gg.setFitsSystemWindows(true);
gg.setLayoutManager(gl);
gg.setAdapter(startpostsystem);
that's my grid adapter code
#Override
public void onBindViewHolder(Grid_view holder, final int position) {
holder.im.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
String getfiledop = fall[position].getAbsolutePath();
Intent is = new Intent(cm,Open_post_item.class);
is.putExtra("req",12);
cm.startActivity(is);
and this is my grid view items layout code.
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="140dp">
<ImageView
android:id="#+id/imageView18"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:adjustViewBounds="true"
app:srcCompat="#drawable/sunbow100" />
I tried to use :
android:scaleType="centerCrop"
android:adjustViewBounds="true"
or fitxy it make it worse
view bounds won't work either.
if i add more images like 800*400 or ... it will have white space
so where is problem where I do wrong.
try using android:src in place of app:srcCompat
<ImageView
android:id="#+id/imageView18"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:adjustViewBounds="true"
android:src="#drawable/sunbow100" />

Android dialog wrap_content not working

I have a custom dialog set up and I have the layout's width set to wrap_content but it is still taking the entire screen width. I even tried setting the width to 100dp and it still uses the whole screen Why does this happen?
I have set up the dialog like this:
public class DialogGoToLine extends Dialog
{
//The root view of the dialog
private static View rootView;
public DialogGoToLine(Context context, int themeResId){
super(context, themeResId);
}
#Override
protected void onCreate(Bundle savedInstanceState){
super.onCreate(savedInstanceState);
//Allow the dialog to be canceled by tapping out of its bounds
setCancelable(true);
//Inflate the custom layout
LayoutInflater layoutInflater = LayoutInflater.from(HotspotHelper.getAppContext());
rootView = layoutInflater.inflate(R.layout.dialog_go_to_line, null);
//Set up the layout
//setTitle(HotspotHelper.getAppContext().getString(R.string.clientDetails));
//setTitle("Go to line");
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(rootView);
final EditText editText = (EditText) rootView.findViewById(R.id.editTextGoToLine);
Button buttonGoToLine = (Button) rootView.findViewById(R.id.buttonGoToLine);
buttonGoToLine.setOnClickListener(new View.OnClickListener(){
#Override
public void onClick(View p1)
{
int line = Integer.valueOf(editText.getText().toString()) - 1;
((LinearLayoutManager)LogActivity.recyclerViewLog.getLayoutManager()).scrollToPositionWithOffset(line, (int)HotspotHelper.dpToPx(30));
dismiss();
}
});
}
}
And the layout XML:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
android:gravity="center_vertical"
android:orientation="horizontal">
<TextView
android:id="#+id/textViewGoToLabel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="4dp"
android:labelFor="#+id/editTextGoToLine"
android:text="Go to line: "
android:background="#color/accent"
android:textColor="#color/primaryText"
android:textSize="18sp"/>
<EditText
android:id="#id/editTextGoToLine"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:singleLine="true"
android:layout_margin="4dp"
android:layout_centerVertical="true"
android:inputType="number"
android:gravity="center"
android:textSize="18sp"/>
<Button
android:id="#+id/buttonGoToLine"
android:layout_width="wrap_content"
android:text="Go"
android:layout_margin="4dp"
android:textSize="18sp"
android:layout_height="wrap_content"/>
Edit 1
If it makes a difference, this dialog has a style in which I declared the background to this drawable:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<solid android:color="#color/colorPrimary"/>
<corners
android:radius="2dp" />
</shape>
Use have to use this method setContentView(View view, ViewGroup.LayoutParams params) instead of setContentView(rootView);
ViewGroup.LayoutParams params= new ViewGroup.LayoutParams(
ViewGroup.LayoutParams.WRAP_CONTENT,
ViewGroup.LayoutParams.WRAP_CONTENT);
//ViewGroup.LayoutParams params= new ViewGroup.LayoutParams(
// 300,
// 300);
//for coustom size
params.height = thumb_size;
params.width = thumb_size;
// set padding ,margins ,gravity as your desired
Use this setContentView(rootView, params);
I faced same issue, and i came across a solution. If you give fixed width or wrap_content to your root of your layout, it doesn't consider that. I don't know the reason behind this. Put one more parent layout inside your root and give required width and height to the inner parent, put all views inside this parent. I hope it helps.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorPrimary"
android:gravity="center_vertical"
android:orientation="horizontal">
<LinearLayout
android:layout_width="100dp"
android:layout_height="wrap_content"
android:orientation="horizontal">
//put all your views inside this linear layout
<TextView......./>
<TextView......./>
<TextView......./>
</LinearLayout>
</LinearLayout>
Try this before showing the dialog:
dialog.getWindow().setLayout(context.getResources().getDimensionPixelSize(R.dimen.dialog_width), WindowManager.LayoutParams.WRAP_CONTENT)
dialog_width is 100dp.
For some reason, removing the theme that I applied to the dialog fixed the wrap_content issue. The only thing the custom theme did was set the background of the dialog, but removing it has solved the issue.
Try changing the android:orientation="vertical" in your main Linear Layout because You are using linear layout with horizontal orientation so all the widgets are aligned horizontally and they are acquiring their assigned space horizontally that's why it cover the whole screen.

How to stretch image of Spinner?

I have a Spinner with only image inside.
Can I stretch the image all over the spinner?
row.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/country_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/image"/>
</LinearLayout>
CustomAdapter
public View getCustomView(int position, View convertView,ViewGroup parent)
{
LayoutInflater inflater = (LayoutInflater) m_Contex.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View row = inflater.inflate(R.layout.row, parent, false);
ImageView icon = (ImageView) row.findViewById(R.id.country_icon);
icon.setImageResource(m_CountryImages.get(position));
return row;
}
Try this instead:
<ImageView
android:id="#+id/country_icon"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/image"/>
If its API 7 or lower use fill_parent instead match_parent. Also make sure, that the icon is properly stretched inside itself, and there is no unnecessary transparent bacground that makes icon larger than you actually need
If you use
android:scaleType="fitXY"
your image will stretch over the entire display area.

Scroll a RelativeLayout when it contains custom Views

I'm trying to make scrollable RelativeLayout, that contains some custom Views. This is the plan of cinema hall, i have x, y coordinates of places and it's width and height (that are just rectangales, actually). I just put it into this RelativeLayout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:padding="10px">
<ScrollView
android:layout_height="wrap_content"
android:layout_width="fill_parent">
<RelativeLayout android:id="#+id/scrollable_places"
android:layout_height="wrap_content"
android:layout_width="wrap_content">
</RelativeLayout>
</ScrollView>
I put it like this:
RelativeLayout layout = (RelativeLayout) context.findViewById(R.id.scrollable_places);
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(place.getWidth(),
place.getHeight());
params.leftMargin = place.getX();
params.topMargin = place.getY();
layout.addView(new Seat(context, place), params);
Seat class looks like this:
public class Seat extends View {
private Place place;
private boolean isRed = false;
public Seat(Context context, Place place) {
super(context);
this.place = place;
setOnClickListener(new OnSeatClickListener());
}
#Override
protected void onDraw(Canvas canvas) {
if (!isRed)
canvas.drawColor(Color.GREEN);
else
canvas.drawColor(Color.RED);
}
protected void setRed() {
isRed = true;
}
private class OnSeatClickListener implements OnClickListener {
#Override
public void onClick(View view) {
((Seat) view).setRed();
view.invalidate();
}
}
}
Views are drawing perfectly. But I have ann array of views, and when some of them go out of the screen, scrollView didn't work, there is no scroll on the screen. Have you any ideas how can I make this layout scroll?
You should try following xml file. It will work on all the devices.
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:fillViewport="true"
android:padding="10px"
android:layout_height="fill_parent"
android:layout_width="fill_parent">
<RelativeLayout android:id="#+id/scrollable_places"
android:layout_height="wrap_content"
android:layout_width="wrap_content">
</RelativeLayout>
</ScrollView>
Thanks.
In scroll view you have written android:layout_height="wrap_content" instead of using wrap_content five specific height size eg android:layout_height="100dip"
Thanks
Deepak

Categories