I'm learning Android and I was trying out FrameLayout containing ImageViews, I tried to do a little app that switchs between two images when you click on them the code is the following:
My xml looks like this:
>
<FrameLayout 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=".Hola" >
<ImageView
android:id="#+id/segunda"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="metodosegunda"
android:scaleType="fitCenter"
android:src="#drawable/img1" />
<ImageView
android:id="#+id/primera"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="metodoprimera"
android:scaleType="fitCenter"
android:src="#drawable/img2" />
</FrameLayout>
And my main program:
public class Hola extends Activity {
ImageView primera;
ImageView segunda;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.teta_layout);
primera = (ImageView) findViewById(R.id.primera);
segunda = (ImageView) findViewById(R.id.segunda);
}
public void metodoprimera (View view){
primera.setVisibility(View.GONE);
segunda.setVisibility(View.VISIBLE);
}
public void metodosegunda (View view){
segunda.setVisibility(View.GONE);
primera.setVisibility(View.VISIBLE);
}
}
This program should show an image and as soon as you click on it it should hide that image and show the other and so on.
The thing is that this won't work , but as soon as I switch the imageview order in the xml, it works, and i don't really understand why it should not work this way.
Thank you guys in advance
Try adding:
android:visibility="gone"
to the XML for one of the ImageView's.
I'll try to go more explicit with the explanation, here is the thing:
If I have the XML like this it will show the images (depending on visibility) but the oClick thing will not work:
<FrameLayout 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=".Hola" >
<ImageView
android:id="#+id/segunda"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="metodosegunda"
android:scaleType="fitCenter"
android:src="#drawable/img1"
android:visibility="gone" />
<ImageView
android:id="#+id/primera"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="metodoprimera"
android:scaleType="fitCenter"
android:src="#drawable/img2"
android:visibility="visible" />
</FrameLayout>
If I swap the ImageView's order in the XML It will work perfectly:
<FrameLayout 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=".Hola" >
<ImageView
android:id="#+id/primera"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="metodoprimera"
android:scaleType="fitCenter"
android:src="#drawable/img2"
android:visibility="visible" />
<ImageView
android:id="#+id/segunda"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="metodosegunda"
android:scaleType="fitCenter"
android:src="#drawable/img1"
android:visibility="gone" />
</FrameLayout>
It's not about the visibility of each Imageview since it does not matter what value I put on them It won't work the first way but i will work the second way.
Seems like a weird issue since the oder of the imageviews should not matter if you set them visible or gone ...
Related
I'm encountering some really strange behaviors with RecyclerView and it's about anchoring and aligning views inside one row of RecyclerView. So here is how the result from row should look:
And here are two pictures showing final result:
This is not happening always. Sometimes views inside are messed up like on attached images above and sometimes are not. Anyway here is my xml file showing how row layout looks:
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto">
<RelativeLayout android:id="#+id/background"
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="wrap_content">
<de.hdodenhof.circleimageview.CircleImageView
android:layout_margin="24dp"
android:id="#+id/iv_user_icon"
android:layout_width="50dp"
android:layout_height="50dp"
android:src="#drawable/ic_zelena_bez_lopte"
app:civ_border="true"
app:civ_border_color="#color/colorAccent"
app:civ_border_width="1dp"
app:civ_shadow="true"
app:civ_shadow_color="#android:color/black"
app:civ_shadow_radius="10"/>
<LinearLayout
android:id="#+id/username_container"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/iv_user_icon"
android:layout_alignTop="#+id/iv_user_icon"
android:layout_marginLeft="20dp"
android:layout_marginStart="20dp"
android:layout_toEndOf="#+id/iv_user_icon"
android:layout_toRightOf="#+id/iv_user_icon"
android:gravity="center|start"
android:orientation="vertical">
<TextView
android:id="#+id/tv_username"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Mr.Bean"
android:textColor="#android:color/white"
android:textSize="12sp"
android:typeface="sans"/>
<TextView
android:id="#+id/tv_city_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:textColor="#color/colorAccent"
android:textSize="12sp"
android:typeface="sans"/>
</LinearLayout>
<ImageView
android:id="#+id/iv_option"
android:layout_width="25dp"
android:layout_height="25dp"
android:layout_alignBottom="#+id/iv_user_icon"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_alignTop="#+id/iv_user_icon"
android:layout_marginEnd="20dp"
android:layout_marginRight="20dp"
android:background="#null"
android:src="#drawable/ic_message"/>
<View
android:id="#+id/lst_item_divider"
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_alignLeft="#+id/username_container"
android:layout_alignStart="#+id/username_container"
android:layout_below="#+id/username_container"
android:background="#color/main_text_color"/>
</RelativeLayout>
<ImageView
android:visibility="visible"
app:layout_anchor="#+id/iv_user_icon"
app:layout_anchorGravity="bottom|center|end|right"
android:src="#drawable/icon"
android:id="#+id/iv_star"
android:layout_width="30dp"
android:layout_height="30dp"/>
</android.support.design.widget.CoordinatorLayout>
I'm doing some hiding views inside adapter when i need to, and maybe that's an issue, i really don't know. I have tried without hiding views when checking some conditions inside adapter, but same results. Just to explain, i'm hiding inbox icon because if my username is showed in list i would like to hide it because i wouldn't want to send myself message and also this badge icon will be shown to one user only.
Here is code from adapter:
#Override
public void onBindViewHolder(final TeamMembersListAdapter.HeaderViewHolder holder, int position) {
final User user = teamUsers.get(position);
Glide.with(mContext)
.load(Uri.parse(user.getImage()))
.diskCacheStrategy(DiskCacheStrategy.SOURCE)
.placeholder(R.drawable.ic_zelena_bez_lopte)
.error(R.drawable.ic_zelena_bez_lopte)
.dontAnimate()
.into(holder.profileImage);
String selfUserId = AppController.getInstance().getDatabase().getUserDetails().get("user_id");
if (user.getCreatorId() == Integer.parseInt(user.getId())) {
holder.ivBadge.setVisibility(View.VISIBLE);
} else {
holder.ivBadge.setVisibility(View.INVISIBLE);
}
if (selfUserId.equals(user.getId())) {
holder.ivSendMessage.setVisibility(View.INVISIBLE);
} else {
holder.ivSendMessage.setVisibility(View.VISIBLE);
}
holder.tvUsername.setText(user.getName());
holder.tvCityName.setText(user.getCity());
holder.bgContainer.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
mOnItemClickListener.onItemClickListener(holder.getAdapterPosition());
}
});
}
Shouldn't all views be together inside the RelativeLayout?
I don't get why You even need the CoordinatorLayout, maybe try to get rid off Coordinator and wrap all inside Relative.
I would suggest also to try the ConstraintLayout - it should be super easy to done this in such layout.
Here, check this out
https://developer.android.com/training/constraint-layout/index.html#add-constraintlayout-to-your-project
Are there any android library that do:
Shows drawables in either a grid or scroll view.
Allows user to select one of the images and shows his selection.
Allows me to get the selected drawable and show it to the user.
Please see the screenshots to see what I'm trying to achieve.
I have done something like you are thinking about. I will show you that if is useful to you (I think will be, but you must adapt this):
Context: I have created a simple game based in Space Invaders. My game has a main menu (main activity) where the player can press 'PLAY' or scan elect some 'OPTIONS', though a popup.
App main menu image
1 screen: Main menu.
2 screen: Popup appears when I press 'OPTIONS' button. This popup let me choose graphic options (change game background, ally spaceship model and enemy spaship model).
MainActivity.java
optionBoton.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
soundMenu.start();
LayoutInflater inflater = (LayoutInflater) getBaseContext().getSystemService(LAYOUT_INFLATER_SERVICE);
View viewPopup = inflater.inflate(R.layout.popup_activity, null);
popup = new PopupWindow(
viewPopup,
RelativeLayout.LayoutParams.MATCH_PARENT,
RelativeLayout.LayoutParams.WRAP_CONTENT
);
popup.showAtLocation(layoutPrincipal, Gravity.BOTTOM, 0, 0);
ImageButton closePop = (ImageButton) vistaPopup.findViewById(R.id.volver_boton);
closePop.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
soundMenu.start();
popup.dismiss();
optionBoton.setVisibility(View.VISIBLE);
}
});
optionBoton.setVisibility(View.INVISIBLE);
}
});
This code will be inside onCreate method.
Now, you need to design your own XML popup (if you decide to create a popup). Showing a popup is easy, clean and dynamic way to change the graphic options.
popup_activity.xml
<?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="match_parent"
android:background="#839ceaac"
android:orientation="vertical">
<ImageButton
android:id="#+id/volver_boton"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignParentRight="true"
android:layout_marginRight="2dp"
android:layout_marginTop="3dp"
android:background="#android:color/transparent"
android:scaleType="centerCrop"
android:src="#drawable/wcerrar" />
<TextView
android:id="#+id/options_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginBottom="6dp"
android:layout_marginTop="5dp"
android:text="Opciones gráficas"
android:textSize="20dp"
android:textStyle="bold" />
<View
android:layout_width="match_parent"
android:layout_height="2dp"
android:layout_below="#id/options_title"
android:background="#9dc8a6" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/options_title"
android:layout_marginBottom="8dp"
android:layout_marginTop="5dp"
android:orientation="horizontal">
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1">
<TextView
android:id="#+id/back_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginBottom="3dp"
android:text="Fondo"
android:textSize="15sp"
android:textStyle="bold" />
<ImageView
android:id="#+id/back_1"
android:layout_width="40dp"
android:layout_height="60dp"
android:layout_below="#id/back_title"
android:layout_centerHorizontal="true"
android:layout_marginBottom="3dp"
android:adjustViewBounds="true"
android:onClick="uploadBack"
android:scaleType="centerCrop"
android:src="#drawable/fondo" />
<ImageView
android:id="#+id/back_2"
android:layout_width="40dp"
android:layout_height="60dp"
android:layout_below="#id/back_1"
android:layout_centerHorizontal="true"
android:layout_marginBottom="3dp"
android:adjustViewBounds="true"
android:onClick="uploadBack"
android:scaleType="centerCrop"
android:src="#drawable/fondo1" />
<ImageView
android:id="#+id/back_3"
android:layout_width="40dp"
android:layout_height="60dp"
android:layout_below="#id/back_2"
android:layout_centerHorizontal="true"
android:layout_marginBottom="3dp"
android:adjustViewBounds="true"
android:onClick="uploadBack"
android:scaleType="centerCrop"
android:src="#drawable/fondo3" />
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1">
<TextView
android:id="#+id/spaceship_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginBottom="3dp"
android:text="Spaceship"
android:textSize="15sp"
android:textStyle="bold" />
<ImageView
android:id="#+id/spaceship_1"
android:layout_width="40dp"
android:layout_height="60dp"
android:layout_below="#id/spaceship_title"
android:layout_centerHorizontal="true"
android:layout_marginBottom="3dp"
android:adjustViewBounds="true"
android:onClick="uploadSpaceship"
android:src="#drawable/diseno11" />
<ImageView
android:id="#+id/spaceship_2"
android:layout_width="40dp"
android:layout_height="60dp"
android:layout_below="#id/spaceship_1"
android:layout_centerHorizontal="true"
android:layout_marginBottom="3dp"
android:adjustViewBounds="true"
android:onClick="uploadSpaceship"
android:src="#drawable/diseno21" />
<ImageView
android:id="#+id/spaceship_3"
android:layout_width="40dp"
android:layout_height="60dp"
android:layout_below="#id/spaceship_2"
android:layout_centerHorizontal="true"
android:layout_marginBottom="3dp"
android:adjustViewBounds="true"
android:onClick="uploadSpaceship"
android:src="#drawable/diseno31" />
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1">
<TextView
android:id="#+id/enemy_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginBottom="3dp"
android:text="Enemies"
android:textSize="15sp"
android:textStyle="bold" />
<ImageView
android:id="#+id/enemy_1"
android:layout_width="40dp"
android:layout_height="60dp"
android:layout_below="#id/enemy_title"
android:layout_centerHorizontal="true"
android:layout_marginBottom="3dp"
android:adjustViewBounds="true"
android:onClick="uploadEnemy"
android:rotation="180"
android:src="#drawable/enemigodiseno11" />
<ImageView
android:id="#+id/enemy_2"
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_below="#id/enemy_1"
android:layout_marginBottom="3dp"
android:layout_centerHorizontal="true"
android:src="#drawable/enemigodiseno21"
android:onClick="uploadEnemy"/>
</RelativeLayout>
</LinearLayout>
</RelativeLayout>
Anyway, if you choose to don't use a popup, I will show you how you can send some data to another activity in Android development:
When you press on a graphic option, look at the call "android:onclick". This allows to call a java method to capture the option selected.
Look a simple example of this:
Method example
public void uploadBack(View view) {
switch (view.getId()) {
case R.id.back_1:
result[0] = "back";
break;
case R.id.back_2:
result[0] = "back1";
break;
case R.id.back_3:
result[0] = "back3";
break;
}
}
As you can see, I have an array of Strings with 3 positions. When I click an ImageView, I call the method wich changes the result[i] value. When I press 'PLAY' and I call the game activity, I use putExtra method to send these options and change the game settings.
I hope this serve as a help for your problem.
Have a nice day!
I want to make layout for Image Slider, so have to create the view pager as well as have to make a overlay at the bottom of view pager.
How can I create that layout for Image Slider.
As i mentioned above image like that want to make layout in android
Thanks in Advance
I used a component like this before.
Basicly those codes should be enough for you. It doesn't have to be complicated realy.
These are your layout codes. I'm sure you will manage to use them in java codes according to your needs.
Here is the link for horizontalListView:
https://github.com/sephiroth74/HorizontalVariableListView
<?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="match_parent">
<android.support.v4.view.ViewPager
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffAAAAAA" />
<!--You may use here-->
<!--HorizontalListView or-->
<!--RecyclerView with horizontal layoutManager-->
<!--I would use HorizontalListView it's easier-->
<!--You may find it by searching in google-->
<HorizontalListView
android:layout_width="match_parent"
android:layout_gravity="bottom"
android:layout_height="150dp"
android:background="#66FFffFF" />
</FrameLayout>
Happy coding.
this is xml code :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/white"
android:orientation="vertical" >
<ImageView
android:id="#+id/selected"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above="#+id/gallery_relative_layout"
android:layout_marginLeft="30dip"
android:layout_marginRight="30dip"
android:layout_marginTop="30dip"
/>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#000000"
android:layout_marginTop="300dp"
android:layout_above="#+id/gallery_relative_layout"
/>
<RelativeLayout
android:id="#+id/gallery_relative_layout"
android:layout_width="fill_parent"
android:layout_height="200dip"
android:layout_alignParentBottom="true"
android:orientation="horizontal"
android:paddingTop="20dp">
<HorizontalScrollView
android:id="#+id/hor_scroll_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<LinearLayout
android:id="#+id/gallery"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<ImageView
android:id="#+id/image1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/im1"
android:onClick="biggerView"/>
<ImageView
android:id="#+id/image2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/im2"
android:onClick="biggerView"/>
<ImageView
android:id="#+id/image3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/im3"
android:onClick="biggerView"/>
<ImageView
android:id="#+id/image4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/im4"
android:onClick="biggerView"/>
<ImageView
android:id="#+id/image5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/im5"
android:onClick="biggerView"/>
<ImageView
android:id="#+id/image6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/im6"
android:onClick="biggerView"/>
<ImageView
android:id="#+id/image7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/im7"
android:onClick="biggerView"/>
</LinearLayout>
</HorizontalScrollView>
</RelativeLayout>
</RelativeLayout>
this is MainActivity.java code :
public class MainActivity extends Activity {
ImageView im;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
public void biggerView(View v)
{
im=(ImageView)findViewById(R.id.selected);
switch (v.getId())
{
case R.id.image1: im.setImageResource(R.drawable.im1);
break;
case R.id.image2: im.setImageResource(R.drawable.im2);
break;
case R.id.image3: im.setImageResource(R.drawable.im3);
break;
case R.id.image4: im.setImageResource(R.drawable.im4);
break;
case R.id.image5: im.setImageResource(R.drawable.im5);
break;
case R.id.image6: im.setImageResource(R.drawable.im6);
break;
case R.id.image7: im.setImageResource(R.drawable.im7);
break;
}
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
}
here is output :
When you click any image it display as follow.
NOTE : Here I have used my Image used your Image and see the result.
You can use Recycler View at Bottom. and add a LinearLayoutManager with Horizontal scrolling. add a a single item image view in your adapter. It will definitely help you :)
Here is my full layout file:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:orientation="vertical" >
<RelativeLayout
android:id="#+id/relativeLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:orientation="horizontal" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:onClick="showButtons"
android:text="#string/buttons_label" />
</RelativeLayout>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/relativeLayout1"
android:layout_centerHorizontal="true"
android:onClick="showSpinners"
android:text="#string/spinners_label" />
</RelativeLayout>
And here is where I call showSpinners:
private void showSpinners(View clickedButton){
goToActivity(SpinnerActivity.class);
}
Eclipse underlines in yellow showSpinners by saying it's never used locally, my guess is it is not detecting my onClick attribute in the layout file.
I'm wondering why it just wont work and what I should do to make it work...
Change the your method to :
public void showSpinners(View clickedButton) {
// do the work
}
The method needs to be visible outside the class (source).
I am trying to create a screen (in portrait mode) that shows 4 images (same size, intended to scale down to fit screen), taking up the entire screen, breaking up the screen into quadrants (a tall, 2x2 grid). This will act as a main menu type of activity and each image should be clickable, in order to take the user to a different activity.
I have tried using a GridView inside a LinerLayout (using a lot from Google's GridView tutorial) but cannot get the images to all scale properly to fill the entire screen. I get extra margins around the images and/or scrolling of the entire screen.
I have also tried using a TableLayout, placing 2 images in each of the 2 rows. Visually, that worked perfectly. Unfortunately when using that, I cannot seem to reference the ImageView items in the TableLayout in my activity code (findViewById always returns null).
I feel like a TableLayout is really not the "right thing to do" but I would like to hear what others have to say. Either way, what should be done to accomplish my desired functionality?
Thanks.
Edit 1.1:
The relative layout works much better for getting things lined up. Now I'm just left with the issue where findViewById always returns null. Here is my code so far:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#color/homescreen_bgcolor"
>
<ImageView id="#+id/one"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:src="#drawable/item1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<ImageView id="#+id/two"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:src="#drawable/item2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<ImageView id="#+id/three"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:src="#drawable/item3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<ImageView id="#+id/four"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:src="#drawable/item4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</RelativeLayout>
public class HomeScreenActivity2 extends Activity {
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.homescreen2);
ImageView imageView = (ImageView) findViewById(R.id.one);
imageView.setClickable(true);
imageView.setOnClickListener(new View.OnClickListener() {
public void onClick(View view) {
Log.i("Test", "test");
}
});
}
}
Here is a sample layout showing how you can achieve a 2 X 2 grid that covers the entire screen using just a RelativeLayout.
<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" >
<View
android:id="#+id/centerVerticalShim"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_centerVertical="true"
android:visibility="invisible" />
<View
android:id="#+id/centerHorizontalShim"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:visibility="invisible" />
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/centerVerticalShim"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_toLeftOf="#+id/centerHorizontalShim"
android:background="#42A5F5"
android:gravity="center"
android:text="#string/one"
android:textColor="#FFFFFF" >
</TextView>
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/centerVerticalShim"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_toRightOf="#+id/centerHorizontalShim"
android:background="#EF5350"
android:gravity="center"
android:text="#string/two"
android:textColor="#FFFFFF" >
</TextView>
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_below="#+id/centerVerticalShim"
android:layout_toLeftOf="#+id/centerHorizontalShim"
android:background="#66BB6A"
android:gravity="center"
android:text="#string/three"
android:textColor="#FFFFFF" >
</TextView>
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_below="#+id/centerVerticalShim"
android:layout_toRightOf="#+id/centerHorizontalShim"
android:background="#5C6BC0"
android:gravity="center"
android:text="#string/four"
android:textColor="#FFFFFF" >
</TextView></RelativeLayout>
The above layout results in this:
I think a TableLayout could work for you, but I'd recommend trying out RelativeLayout as well. You can basically pin your images to the four quadrants by using combinations of
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"`
on your images.
I'm doing something similar in my app where I have multiple buttons on a homepage that can launch corresponding activities. RelativeLayout works fine, and it avoids nested Layout objects, which can hamper performance during render and layout procedures (if it gets out of hand).