How to stretch image of Spinner? - java

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.

Related

Incorrect displaying FrameLayout item in listview

FrameLayout for some reason doesn't work perfectly in listview. I got this incorrect displaying in emulator. In Android Studio items looks nicely. Please help me :)
In Android Studio
In emulator
item.xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="100dp"
android:padding="10dp">
<TextView
android:id="#+id/txtName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Title"
android:layout_gravity="center"
android:textSize="27sp"
android:textStyle="bold"/>
<TextView
android:id="#+id/txtGenre"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Genre"
android:layout_gravity="bottom|right"
android:textSize="18sp"
android:textStyle="italic"/>
<TextView
android:id="#+id/txtId"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="ID"
android:textSize="18sp"
android:textStyle="italic"
android:layout_gravity="bottom|left"/>
</FrameLayout>
Adapter code
public class MyFilmListAdapter extends ArrayAdapter<Film> {
Context context;
ArrayList<Film> films;
public MyFilmListAdapter(#NonNull Context context, ArrayList<Film> films) {
super(context, R.layout.item_film, films);
this.context = context;
this.films = films;
}
#NonNull
#Override
public View getView(int position, #Nullable View convertView, #NonNull ViewGroup parent) {
Film f = films.get(position);
LayoutInflater inflater = LayoutInflater.from(context);
View v = inflater.inflate(R.layout.item_film, null, false);
TextView name = v.findViewById(R.id.txtName);
TextView genre = v.findViewById(R.id.txtGenre);
TextView id = v.findViewById(R.id.txtId);
name.setText(f.getName() + "");
genre.setText(f.getGenre() + "");
id.setText(f.getId() + "");
return v;
}
}
I tried to use LinerLayout and it has correct displaying, however I need FrameLayout.
According to the official documentation
FrameLayout is designed to block out an area on the screen to display a single item. Generally, FrameLayout should be used to hold a single child view, because it can be difficult to organise child views in a way that's scalable to different screen sizes without the children overlapping each other.
You can, however, add multiple children to a FrameLayout and control their position within the FrameLayout by assigning gravity to each child, using the android:layout_gravity attribute.
So you can use LinearLayout inside it.
and nowadays better is you should use Recyclerview with ConstraintLayout

Can I convert a View to Layout?

In android, one can Inflate a Layout file and will get a View in return.
For Example:
LayoutInflater layoutInflater = LayoutInflater.from(context);
View myView = layoutInflater.inflate(R.layout.example_layout, null);
But I'm trying if I can get a Layout back from that inflated layout which is now a View?
Something by which I can retrieve back the original Layout from the Inflated View.
LayoutInflater layoutInflater = LayoutInflater.from(context);
LinearLayout myView = (LinearLayout)layoutInflater.inflate(R.layout.example_layout, null);
That's it!
Just be sure that the root view in your layout.example_layout is a LinearLayout or whatever layout you desire. Otherwise you'll have a ClassCastException
Every layout or ViewGroup extends View, that's why the inflate method returns a View, it's up to you then performing the right cast.
Consider the layout below. It has a text view only.
<TextView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="#dimen/mediumTextSize"
android:textColor="#color/black_text_color"
/>
After inflation you can directly get the textView as its the only view contain in layout.
LayoutInflater inflater=LayoutInflater.from(this);
TextView view=(TextView)inflater.inflate(R.layout.temp,null);
Now consider the layout below .
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:id="#+id/txtName"
android:layout_width="match_parent"
android:layout_height="40dp"
android:textColor="#color/black_text_color"
android:textSize="#dimen/largeTExtSize" />
<TextView
android:id="#+id/csvName"
android:layout_width="match_parent"
android:layout_height="40dp"
android:textColor="#color/black_text_color"
android:textSize="#dimen/largeTExtSize" />
</LinearLayout>
On inflation.
LayoutInflater inflater=LayoutInflater.from(this);
View view=inflater.inflate(R.layout.temp,null);
//Or you can do
// LinearLayout view=(LinearLayout)inflater.inflate(R.layout.temp,null);
TextView txt=view.findViewById(R.id.txtId);

Spinner's background image appears stretched

I have created a dropdown spinner with a background custom image. I have placed the spinner in a linear layout and I have aligned items using weight.
Here is my code -
XML -
<LinearLayout
android:id="#+id/csbar"
android:windowSoftInputMode="adjustPan"
android:paddingTop="8dp"
android:paddingBottom="8dp"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:background="#101010"
android:layout_height="wrap_content">
<ImageButton
android:id="#+id/run"
android:layout_width="0dp"
android:layout_height="#dimen/height"
android:layout_weight="1"
android:background="#null"
android:contentDescription="#string/nul"
android:src="#drawable/ic_action_play" />
<ImageButton
android:id="#+id/save"
android:layout_width="0dp"
android:layout_height="#dimen/height"
android:layout_weight="1"
android:background="#null"
android:contentDescription="#string/nul"
android:src="#drawable/ic_action_save" />
<Spinner
android:id="#+id/more"
android:layout_width="0dp"
android:layout_weight="1"
android:background="#drawable/ic_action_sort_by_size"
android:layout_height="#dimen/height"/>
</LinearLayout>
Java -
int firstC = 0;
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
/////I have removed rest of the code to make it more legible/////
Spinner more = (Spinner) rootView.findViewById(R.id.more);
ArrayAdapter<CharSequence> adapter = ArrayAdapter.createFromResource(getActivity(),
R.array.more, android.R.layout.simple_spinner_item);
adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);
more.setAdapter(adapter);
more.setOnItemSelectedListener(this);
}
#Override
public void onItemSelected(AdapterView<?> parent, View view, int position,
long id) {
((TextView)view).setText(null);
}
Here is the output -
As you can see the sort by size icon (icon on right) appears stretched.
How I want it to look like -
What is wrong with my code? Please help.
The background image takes all the given space - 1/3 of the the LinearLayout width. If you don’t want it to stretch, you could create a drawable layout, e.g. drawable/my_sort_icon:
<?xml version="1.0" encoding="utf-8"?>
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
android:src="#drawable/ic_action_sort_by_size"
android:tileMode="disabled"
android:gravity="center" />
and use it as a background image in your Spinner:
<Spinner
android:id="#+id/more"
android:layout_width="0dp"
android:layout_weight="1"
android:background="#drawable/my_sort_icon"
android:layout_height="#dimen/height"/>

Expandable List: different background colors for ListGroup Items

I'm trying to have these two colors for the ListGroup items in my list: #E1E1E1 and #C2C2C2. The first for the even items and the other for the odd ones. It's 'partially' working. When the activity that opens the list is opened, I get the correct result but ONLY FOR THE VISIBLE PART of the list. If I scroll down, the backgrounds are all of the default color. If I scroll down and flip my phone into landscape mode, the activity gets created again and, again, I get the correct result only for the visible part of the list. I hope someone can help me a bit :)
EDIT:
what you see as white in the image is gray15p. The darker is gray30p which is the default in the XML. android:background="#color/gray30p". If I use, if-else it does work, but I can't understand why the gray15p (looks like white) is not being applied using the IF alone.
Here's how it looks:
In my expandable List Adapter:
#Override
public View getGroupView(int groupPosition, boolean isExpanded,
View convertView, ViewGroup parent) {
String headerTitle = (String) getGroup(groupPosition);
if (convertView == null) {
LayoutInflater infalInflater = (LayoutInflater) this._context
.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
convertView = infalInflater.inflate(R.layout.list_group, null);
}
...
...
//set background color in odd items
if(groupPosition%2==0){
LinearLayout groupLayout=(LinearLayout)convertView.findViewById(R.id.groupLinearLayout);
groupLayout.setBackgroundResource(R.color.gray15p);
}
return convertView;
and the layout file list_group.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/groupLinearLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/gray30p"
android:orientation="horizontal" >
<!-- android:padding="8dp"
android:background="#000000"> -->
<ImageView
android:id="#+id/lblListHeaderImage"
android:layout_width="90dp"
android:layout_height="90dp"
android:paddingLeft="?android:attr/expandableListPreferredItemPaddingLeft"
android:paddingTop="1dp"
android:paddingBottom="1dp"
android:src="#drawable/defaultimg"
android:scaleType="fitCenter"
android:contentDescription="#string/app_name"/>
<!--level 1 of expandable list -->
<TextView
android:id="#+id/lblListHeader"
android:layout_width="wrap_content"
android:layout_height="90dp"
android:paddingLeft="10dp"
android:textSize="22sp"
android:paddingTop="5dp"
android:paddingBottom="5dp"
android:gravity="center"
android:textColor="#000000" />
</LinearLayout>
I think whats missing is to set the color for the even items. The Problem is that you adapter loads the layout with the white background and changes it for the odd items to grey, but when you scroll down, the views gets reused. What happen is that your views background is already set to grey.
just adjust your code to something like that
//set background color in odd items
LinearLayout groupLayout=(LinearLayout)convertView.findViewById(R.id.groupLinearLayout)
if(groupPosition%2==0){
groupLayout.setBackgroundResource(R.color.gray15p);
} else {
groupLayout.setBackgroundResource(R.color.gray30p); // <-- important part.
}

How to Increase the size of Image View in Android

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

Categories