Gallery Image not fitting the screen in android - android

I am displaying a bunch of images in the Gallery View.
The layout is ,
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical" >
<Gallery
android:id="#+id/gallery1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:spacing="10dip" >
</Gallery>
<ImageView
android:id="#+id/imgfromWebUrl"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
</ImageView>
</LinearLayout>
and the custom adapter for loading images,
public View getView(int arg0, View paramView, ViewGroup arg2) {
Log.d("","custom Adapter5");
View localView;
if (paramView == null) {
localView = mInflater.inflate(R.layout.property_image_adapter, null);
} else {
localView = paramView;
}
ImageView imgfromWebUrl=(ImageView)localView.findViewById(R.id.imgfromWebUrl);
Log.d("", "pics[0]: "+pics);
imgfromWebUrl.setImageBitmap(pics[arg0]);
imgfromWebUrl.setScaleType(ImageView.ScaleType.FIT_XY);
imgfromWebUrl.setBackgroundResource(defaultItemBackground);
imgfromWebUrl.setLayoutParams(new Gallery.LayoutParams(200, 200));
return imgfromWebUrl;
}
currently my image is shown as,
My image is fit to the center part of the screen. but I want the image to fit full screen,like this image
Please help me out!!
Any help is Appreciated!!

Use this property android:scaleType="fitXY" Document for ImageView.ScaleType

Issue:
Image is fitting to the parent.but your gallery params are fixed of 200.
Solution:
kindly remove that line.
imgfromWebUrl.setLayoutParams(new Gallery.LayoutParams(200, 200));
and make this change in xml:
<Gallery
android:id="#+id/gallery1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:spacing="10dip" >

Configure the layout parameters like so:
i.setLayoutParams( new
Gallery.LayoutParams(WindowManager.LayoutParams.MATCH_PARENT,
WindowManager.LayoutParams.MATCH_PARENT));

Related

Default Image in ImageView used in an Adapter

I just need a way to show default picture on all imageview ( see below ) used in a listview.
This layout is used by an adapter, so no setContentView function is called on this layout. I think this is causing the problem ( the default images doesn't appear ). How can I fix it ?
The image defaultpic.png is in the drawable folder and is 100x100px.
My code:
<?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"
android:paddingLeft="0dp"
android:paddingRight="0dp"
tools:context=".MainActivity"
android:background="#222222"
android:paddingTop="2dp"
android:paddingBottom="2dp">
<TextView
android:id="#+id/profile_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="Title"
android:textColor="#fcdb8c"
android:background="#222222"
android:textStyle="normal"
android:textSize="15sp"
android:layout_alignParentTop="true"
android:lines="1"
android:scrollHorizontally="true"
android:ellipsize="end"
android:paddingRight="40dp"
android:paddingLeft="2dp" />
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:id="#+id/profile"
android:scaleType = "fitXY"
android:src="#drawable/defaultpic"
android:background="#151515"
android:padding="1dp" />
</RelativeLayout>
#Override
public View getView(View convertView, ViewGroup parent) {
RelativeLayout profileLay = (RelativeLayout)profileInf.inflate
(R.layout.profile_layout, parent, false);
TextView profileView = (TextView)profileLay.findViewById(R.id.profile_name);
ImageView coverView = (ImageView)profileLay.findViewById(R.id.profile);
profileView.setText(currProfile.getName());
Drawable img = Drawable.createFromPath(currProfile.getCover());
coverView.setImageDrawable(img);
return profileLay;
}
As k3b said:
your generated layout for the listviewitem has the image
therefore you do not see the default picture.
the way to correct this is to add an if statement.
ImageView coverView = (ImageView)profileLay.findViewById(R.id.profile);
if (Drawable.createFromPath(currProfile.getCover()) == null) {
Drawable img = Drawable.createFromPath(currProfile.getCover());
coverView.setImageDrawable(img);
}
This will cause it to only load the profile cover if it isn't null, but if it is then the default profile image will be used.
your generated layout for the listviewitem has the image
<RelativeLayout...>
<ImageView android:id="#+id/profile" android:src="#drawable/defaultpic" ... />
</RelativeLayout>
and when the listviewitem is created you immediately overwrite the picture in the imageview
#Override
public View getView(View convertView, ViewGroup parent) {
...
ImageView coverView = (ImageView)profileLay.findViewById(R.id.profile);
Drawable img = Drawable.createFromPath(currProfile.getCover());
coverView.setImageDrawable(img);
...
therefor you do not see the default picture

Images in ViewPager don't fill the screen

I am receiving a set of URL images from API to show as slider so I am using viewpager to do my job and when I am trying to set Images in viewpager to fill screen according to imagesize this doesn't happen at all.
All the red line is huge spacing.. I am not sure why this there?
I am trying do the following in XML:
<RelativeLayout
android:id="#+id/pagerIndicator"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_below="#+id/searchlayout"
android:layout_marginBottom="2dp"
android:layout_marginTop="2dp"
android:orientation="vertical">
<TextView
android:id="#+id/noData"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:text="#string/nointernet"
android:textColor="#000000"
android:textSize="14sp"
android:textStyle="italic"
android:visibility="gone" />
<android.support.v4.view.ViewPager
android:id="#+id/myviewpager"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v4.view.ViewPager>
<FrameLayout
android:id="#+id/progressContainer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:visibility="gone"
android:layout_centerVertical="true">
<com.ylg.librarys.ProgressWheel xmlns:wheel="http://schemas.android.com/apk/res-auto"
android:id="#+id/progress_wheel"
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_gravity="center"
android:visibility="visible"
app:matProg_barColor="#color/colorPrimary"
app:matProg_progressIndeterminate="true" />
</FrameLayout>
</RelativeLayout>
<RelativeLayout
android:id="#+id/pagerLayoutIndicator"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/pagerIndicator"
android:layout_marginBottom="5dp"
android:layout_marginTop="2dp">
<com.viewpagerindicator.CirclePageIndicator
android:id="#+id/indicator"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:fillColor="#color/orangeText"
app:pageColor="#color/whitetext"
app:strokeColor="#color/orangeText" />
</RelativeLayout>
PageAdapter looks like this:
#Override
public Object instantiateItem(ViewGroup container, int position)
{
progressContainer.setVisibility(View.GONE);
wheel_layout.setVisibility(View.GONE);
noData = (TextView)rootView.findViewById(R.id.noData);
noData.setVisibility(View.GONE);
ImageView imageView = new ImageView(getActivity());
imageLoader.DisplayImage(bannerItems.get(position).getbannerImage(), 0, imageView);
LayoutParams imageParams = new LayoutParams(
LayoutParams.MATCH_PARENT,LayoutParams.MATCH_PARENT);
imageView.setLayoutParams(imageParams);
LinearLayout layout = new LinearLayout(getActivity());
layout.setOrientation(LinearLayout.VERTICAL);
LayoutParams layoutParams = new LayoutParams(
LayoutParams.MATCH_PARENT,LayoutParams.MATCH_PARENT);
layout.setLayoutParams(layoutParams);
layout.addView(imageView);
final int page = position;
layout.setOnClickListener(new OnClickListener()
{
#Override
public void onClick(View v) {
Toast.makeText(getActivity(),
"Page " + page + " clicked",
Toast.LENGTH_LONG).show();
}});
container.addView(layout);
return layout;
}
Strangely If I don't give the height for the relativeLayout in which viewpager is sitting I don't see the image at all. that is If I set:
<RelativeLayout
android:id="#+id/pagerIndicator"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/searchlayout"
android:layout_marginBottom="2dp"
android:layout_marginTop="2dp"
android:orientation="vertical">
I only get PageIndicator. Above ViewPager with image is not shown at all.
Not sure why this happening? How do I set the image match_parent so that it shows full without any gap?
Try setting imageView's ScaleType .
For Example,
imageView.setScaleType(ScaleType.FIT_XY);
try also other ScaleTypes,
ScaleType.CENTER
ScaleType.CENTER_INSIDE
ScaleType.FIT_CENTER
Hope this work.
Add this in your instantiateItem method
imageView.setScaleType(ImageView.ScaleType.FIT_XY);
This will fill the whole screen with image removing whitespaces.
You can also try other methods
imageView.setScaleType(ImageView.ScaleType.CENTER);
imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
imageView.setScaleType(ImageView.ScaleType.CENTER_INSIDE);
There can't be fulfill your need.if a view pager contains an imageview, it needs a fixed height and width to imageview.you can set the scaletype as fitStart or fitEnd to make the gap before the image or after the image.it will solve a little gap problem.
Thank you.

TextView overlaps ImageView inside a CardView

I'm trying to do a ListView of CardViews.
The CardView contains an ImageView at the top and several TextViews at the bottom.
I manage to do everything right, although for some reason the image don't fit the CardView (so it gets cropped at the top of it) and the TextViews overlaps the rest of the image.
I tried a lot of different solutions, although nothing worked for me and i cam't figure out why.
The main layout:
<ListView android:id="#+id/item_list"
android:layout_width="match_parent"
android:layout_height="wrap_content"></ListView>
</LinearLayout>
The CardView layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin">
<android.support.v7.widget.CardView android:id="#+id/item_card"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView android:id="#+id/item_image"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<TextView android:id="#+id/item_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView android:id="#+id/item_image_desc"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView android:id="#+id/item_desc"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
And the getView() methid:
public View getView(int position, View convertView, ViewGroup parent) {
View cardView;
if (convertView == null) {
LayoutInflater inflater = ((Activity) this.getContext()).getLayoutInflater();
cardView = inflater.inflate(R.layout.item_card_list, parent, false);
}
else {
cardView = convertView;
}
ImageView itemImage = (ImageView)cardView.findViewById(R.id.item_image);
TextView itemTitle = (TextView)cardView.findViewById(R.id.item_title);
TextView imgDesc = (TextView)cardView.findViewById(R.id.item_image_desc);
TextView itemDesc = (TextView)cardView.findViewById(R.id.item_desc);
Item currItem = this.getItem(position);
itemImage.setImageDrawable(currItem.mImageDrawable);
itemTitle.setText(currItem.mTitle);
imgDesc.setText(currItem.mDescription.imageDesc);
itemDesc.setText(currItem.mDescription.descText);
itemImage.setScaleX((float)1000 / currItem.mImageDrawable.getMinimumWidth());
itemImage.setScaleY((float)1000 / currItem.mImageDrawable.getMinimumWidth());
return (cardView);
}
It seems like the CardViews have a max height or something..can't tell :(
Thanks in advance!
My approach was all wrong. I realized that the setScale() methods I used only scaled the bitmap, and not the ImageView itself. Although when I tried to resize the ImageView before it was even layed down on the canvas, I got no luck either. So I did this:
Instead of trying to resizing the ImageView after I assigned it with a small bitmap, I resized the bitmap itself before setting it to the ImageView. Fixed everything :)

Design looks bigger when using minsdkversion 3

I created an app, it's finely working as what i want on minsdkversion="3". But other activities look even bigger than usual. If i change the minsdkversion="8" or something, the other activities looks as normal, but i didn't get the output i want.
Following is the code for gridview and imageview layout files:
activity_main.xml:
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<GridView
android:id="#+id/grid_View"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:horizontalSpacing="0dp"
android:numColumns="4"
android:stretchMode="columnWidth"
android:verticalSpacing="0dp"
android:gravity="center_horizontal"
android:clipChildren="true" >
</GridView>
</LinearLayout>
grid.xml:
<?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:orientation="vertical" >
<ImageView
android:id="#+id/image_View"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="0.05"/>
</LinearLayout>
MainActivity.java:
public View getView(int position, View convertView, ViewGroup parent)
{
ImageView imageView;
if (convertView == null)
{
imageView = new ImageView(mContext);
imageView.setLayoutParams(new GridView.LayoutParams(LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT));
i = i+1;
imageView.setId(i);
Log.d("===== i value =====", String.valueOf(i));
imageView.setAdjustViewBounds(true);
imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
}
else
{
imageView = (ImageView) convertView;
}
imageView.setImageResource(mThumbIds[position]);
return imageView;
}
What is the wrong with my code, what i have to change?
I have to show some toast when particular body part is pressed
Step #1: Display the body in an ImageView
Step #2: Override onTouchEvent() in your activity or fragment that is managing the ImageView
Step #3: Determine the body part based on the location of the touch event and the size of the ImageView, and display your Toast

Adjust GridView to all Screen Sizes

Im trying to implement a GridView as part of a image gallery. I followed the following example from the Android developer portal.
The tutorial seems to work for all screen sizes. As you can see below the proportions for a small and a large screen size are displayed correctly (on the left - small screen size, on the right - large screen size.
But now to my problem. When I want to implement exactly the same GridView within a LinearLayout from my Android Project - the correct proportions are gone - as shown by the images below. The pictures begin to overlap so forth and so on.
I am quite sure that this has something to with my LinearLayout which looks like the following.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/widget64"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<LinearLayout
android:id="#+id/widget34"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="5dp"
android:background="#drawable/foto_detail_bg_cell_0"
>
<ImageView
android:id="#+id/flyer"
android:layout_width="100dp"
android:layout_height="80dp"
android:src="#drawable/icon"
android:scaleType="centerCrop"
/>
<LinearLayout
android:id="#+id/widget36"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5px"
android:orientation="vertical">
<TextView
android:id="#+id/toptext"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Beat.It"
android:textSize="16sp"
android:textStyle="bold"
android:textColor="#color/white"/>
<TextView
android:id="#+id/widget39"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="http://www.google.at"
android:textColor="#color/white"/>
<LinearLayout
android:id="#+id/widget40"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/widget41"
android:layout_width="58dp"
android:layout_height="40dp"
android:src="#drawable/facebook_share"/>
<ImageView
android:id="#+id/widget42"
android:layout_width="58dp"
android:layout_height="40dp"
android:layout_marginLeft="1dp"
android:src="#drawable/photocount"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/gridview"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:columnWidth="90dp"
android:numColumns="auto_fit"
android:verticalSpacing="10dp"
android:horizontalSpacing="10dp"
android:stretchMode="columnWidth"
android:gravity="center"
/>
</LinearLayout>
The MAIN QUESTION:
The Layout XML used by the tutorial on the Android developer portal only uses the GridView alone, without a LinearLayout and and it is shown with correct proportions on each screen size. Why is that? And why does it not work properly when I nest the GridView in a Linear Layout like in my project?
SOLVED:
I solved this issue by editing the ImageAdapter of the GridView. I calculated the size of the generated image views - density independent.
// create a new ImageView for each item referenced by the Adapter
public View getView(int position, View convertView, ViewGroup parent) {
ImageView imageView;
if (convertView == null) {
//Calculation of ImageView Size - density independent.
//maybe you should do this calculation not exactly in this method but put is somewhere else.
Resources r = Resources.getSystem();
float px = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 60, r.getDisplayMetrics());
imageView = new ImageView(mContext);
imageView.setLayoutParams(new GridView.LayoutParams((int)px, (int)px));
imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
//imageView.setPadding(8, 8, 8, 8);
imageView.setBackgroundColor(Color.BLUE);
} else {
imageView = (ImageView) convertView;
}
imageView.setImageResource(mThumbIds[position]);
return imageView;
}
To adjusting Gridview to screen size
In onCreate take rowHeight :
//Get root view
root = binding.root
// Or you can use findviewbyid(R.id.root)
view.onGlobalLayout {
rowHeight =
root.measuredHeight / currentPageNumberOfRow
fillView(appsList)
}
In adapter:
override fun getView(position: Int, ConvertView: View?, parent: ViewGroup?): View? {
var mConvertView = ConvertView
if (layoutInflater == null) {
layoutInflater =
context.getSystemService(Context.LAYOUT_INFLATER_SERVICE) as
layoutInflater!!.inflate(R.layout.item_app_shortcut, null)
}
if (mConvertView == null) {
mConvertView =
layoutInflater!!.inflate(R.layout.item_child_launcher_app, null)
//Add this:
mConvertView.layoutParams = AbsListView.LayoutParams(GridView.AUTO_FIT, rowHeight)
}
Dont forget set row image:
android:layout_width="0dp"
android:layout_height="0dp"
To fit on screen

Categories

Resources