Please see below screenshot for different results on tablet and on phones.
activity.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"
android:id="#+id/frameLayout1"
android:weightSum="4"
android:padding="0dp"
android:orientation="vertical">
<ImageView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:scaleType="centerCrop"
android:src="#drawable/crossword_background"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="0dp"
android:orientation="vertical"
android:id="#+id/frameLayout"
android:weightSum="4"
>
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:background="#android:color/transparent" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/tvTitle"
style="#style/TextAppearance.AppCompat.Widget.ActionBar.Title"
android:layout_width="100dp"
android:layout_height="24dp"
android:layout_marginStart="4dp"
android:layout_marginTop="4dp"
android:layout_marginEnd="4dp"
android:layout_marginBottom="4dp"
android:background="#drawable/count_frame"
android:fontFamily="#font/roboto"
android:gravity="center"
android:textColor="#5A0FC8"
android:textSize="13sp"
android:textStyle="bold"
tools:text="4" />
<TextView
android:id="#+id/menu_item_score"
style="#style/TextAppearance.AppCompat.Widget.ActionBar.Title"
android:layout_width="100dp"
android:layout_height="24dp"
android:layout_margin="4dp"
android:background="#drawable/count_frame"
android:gravity="right"
android:layout_alignParentRight="true"
android:textColor="#5A0FC8"
android:textSize="13sp"
android:textStyle="bold"
android:textAlignment="center"
tools:text="4" />
</RelativeLayout>
</androidx.appcompat.widget.Toolbar>
<LinearLayout
android:id="#+id/rightLayout"
android:layout_width="40dp"
android:layout_height="fill_parent"
android:layout_alignParentEnd="true"
android:layout_below="#id/horizontal_divider"
android:orientation="vertical" >
<LinearLayout
android:layout_weight="1"
android:layout_height="fill_parent"
android:layout_width="match_parent"
android:weightSum="4"
android:orientation="vertical" >
<ImageButton
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#drawable/ic_action_360"
android:background="#null"/>
<ImageButton
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#drawable/ic_action_360"
android:background="#null"/>
<ImageButton
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#drawable/ic_action_360"
android:background="#null"/>
<ImageButton
android:id="#+id/ShowHint"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#drawable/ic_action_360"
android:background="#null"/>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/leftLayout"
android:layout_width="40dp"
android:layout_height="fill_parent"
android:layout_alignParentStart="true"
android:layout_below="#id/horizontal_divider"
android:orientation="vertical" >
<LinearLayout
android:layout_weight="1"
android:layout_height="fill_parent"
android:layout_width="match_parent"
android:weightSum="4"
android:orientation="vertical" >
<ImageButton
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#drawable/ic_action_360"
android:background="#null"/>
<ImageButton
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#drawable/ic_action_360"
android:background="#null"/>
<ImageButton
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#drawable/ic_action_360"
android:background="#null"/>
<ImageButton
android:id="#+id/ShuffleButtons"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#drawable/ic_action_360"
android:background="#null"/>
</LinearLayout>
</LinearLayout>
<View
android:id="#+id/horizontal_divider"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_centerVertical="true" />
<RelativeLayout
android:id="#+id/firstLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="0dp"
android:layout_centerInParent="true"
android:layout_margin="0dp"
android:layout_above="#+id/horizontal_divider"
android:layout_below="#id/toolbar"
android:gravity="center">
<TableLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/tblLayout"
android:gravity="center"
android:padding="0dip"
android:shrinkColumns="*"
android:layout_margin="0dip"
android:layout_centerInParent="true"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true">
</TableLayout>
</RelativeLayout >
<LinearLayout
android:id="#+id/secondLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/horizontal_divider"
android:layout_toStartOf="#id/rightLayout"
android:layout_toEndOf="#id/leftLayout"
android:orientation="vertical" >
<FrameLayout
android:id="#+id/frame_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="5dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_marginBottom="5dp"
>
</FrameLayout>
</LinearLayout>
</RelativeLayout>
background_ic_btn_bonus.xml
<?xml version="1.0" encoding="utf-8"?>
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
android:src="#drawable/ic_btn_bonus"
android:tileMode="disabled" android:gravity="center" >
</bitmap>
background_ic_btn_default.xml
<?xml version="1.0" encoding="utf-8"?>
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
android:src="#drawable/ic_btn_default"
android:tileMode="disabled" android:gravity="center" >
</bitmap>
Corresponding Java Code
String[] iLayoutMap = getTableLayout();
/*
iLayoutMap contains split rows removing 2
2,0,0,0,0,0,0,2,0,0,0,0,0,0,2,0,0,1,1,1,0,2,0,0,0,1,0,0,2,0,0,0,0,0,0,2,0,0,0,0,0,0*/
TableLayout tableLayout = (TableLayout) findViewById(R.id.tblLayout);
for(int i=1;i<iLayoutMap.length;i++){
TableRow NewRow1 =new TableRow(this);
NewRow1.setPadding(0, 0, 0, 0);
NewRow1.setGravity(Gravity.CENTER);
NewRow1.setHorizontalGravity(Gravity.CENTER);
NewRow1.setVerticalGravity(Gravity.CENTER);
String [] items = iLayoutMap[i].split("\\s*,\\s*");
NewRow1.setWeightSum(items.length-1);
for(int j = 0; j < items.length;j++) {
if(items[j].equalsIgnoreCase("0")){
Button btnAdd = new Button(context);
btnAdd.setGravity(Gravity.CENTER);
btnAdd.setTextSize(25);
btnAdd.setTextColor(Color.WHITE);
//btnAdd.setPadding(10 ,10,10,10);
//btnAdd.setBackgroundResource(R.drawable.ic_btn_default);
btnAdd.setBackgroundResource(R.drawable.background_ic_btn_default);
btnAdd.setLayoutParams(new TableRow.LayoutParams(TableRow.LayoutParams.WRAP_CONTENT,TableRow.LayoutParams.WRAP_CONTENT ,1));
NewRow1.addView(btnAdd);
}else if(items[j].equalsIgnoreCase("1")){
//https://stackoverflow.com/questions/3404582/adding-text-to-imageview-in-android
Button btnAdd = new Button(context);
String strId = Integer.toString(i) + Integer.toString(j-1);
//btnAdd.setWidth(iObjectWidth);
//btnAdd.setHeight(iObjectHeight);
btnAdd.setId(Integer.valueOf(strId));
btnAdd.setGravity(Gravity.CENTER);
btnAdd.setTextSize(25);
btnAdd.setTextColor(Color.WHITE);
//btnAdd.setPadding(10 ,10,10,10);
//btnAdd.setBackgroundResource(R.drawable.ic_btn_default);
btnAdd.setBackgroundResource(R.drawable.background_ic_btn_bonus);
btnAdd.setLayoutParams(new TableRow.LayoutParams(TableRow.LayoutParams.WRAP_CONTENT,TableRow.LayoutParams.WRAP_CONTENT,1 ));
NewRow1.addView(btnAdd);
}
}
NewRow1.setLayoutParams(new TableLayout.LayoutParams(TableLayout.LayoutParams.WRAP_CONTENT,TableLayout.LayoutParams.WRAP_CONTENT,items.length-1));
tableLayout.addView(NewRow1);
}
Function
public String[] getTableLayout() {
if (lvlinfo != null) {
return lvlinfo.getLayout().split("2");
}
//Return this as default in case of failure
String arr = "2,0,0,0,0,0,0,2,0,0,0,0,0,0,2,0,0,1,1,1,0,2,0,0,0,1,0,0,2,0,0,0,0,0,0,2,0,0,0,0,0,0";
//String arr = "2,0,0,0,0,0,0,2,0,0,0,0,0,0,2,0,0,1,1,1,0,2,0,0,0,1,0,0,2,0,0,0,0,0,0,2,0,0,0,0,0,0";
return arr.split("2");
}
Expected Result ( Working correctly on Tablet with Android 4.4.2 with below code)
Actual Results ( Tested on multiple phones with OS >= 8.1.0)
I Have tried your code but unable to reproduce this output
For me your code is working fine check the output
Result in Oreo
Result in android pie
Result in android Q
as per my opinion you should use
You should use RecyclerView with GridLayoutManager
Follow this sample code
Add one recyclerview in your activity layout xml file
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/firstLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="0dp"
android:gravity="center">
<androidx.recyclerview.widget.RecyclerView
android:layout_width="wrap_content"
android:id="#+id/gridRecyclerView"
android:layout_centerInParent="true"
android:layout_height="wrap_content"/>
</RelativeLayout>
Now inside your activity set GridLayoutManager to your RecyclerView
GridLayoutManager (Context context,
int spanCount)
Creates a vertical GridLayoutManager
Parameters
context Context: Current context, will be used to access resources.
spanCount int: The number of columns in the grid
import android.os.Bundle;
import androidx.appcompat.app.AppCompatActivity;
import androidx.recyclerview.widget.GridLayoutManager;
import androidx.recyclerview.widget.RecyclerView;
public class JavaActivity extends AppCompatActivity {
RecyclerView myRecyclerView;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_java);
myRecyclerView = findViewById(R.id.gridRecyclerView);
GridLayoutManager gridLayoutManager = new GridLayoutManager(JavaActivity.this, 6);
myRecyclerView.setLayoutManager(gridLayoutManager);
myRecyclerView.setAdapter(new MyAdapter(this));
}
}
Create one adapter class RecyclerView like this
import android.content.Context;
import android.graphics.Color;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import androidx.annotation.NonNull;
import androidx.recyclerview.widget.RecyclerView;
public class MyAdapter extends RecyclerView.Adapter<MyAdapter.MyViewHolder> {
private Context context;
public MyAdapter(Context context) {
this.context = context;
}
#NonNull
#Override
public MyViewHolder onCreateViewHolder(#NonNull ViewGroup parent, int viewType) {
View view = LayoutInflater.from(context).inflate(R.layout.row_list_item, parent, false);
return new MyViewHolder(view);
}
#Override
public void onBindViewHolder(#NonNull MyViewHolder holder, int position) {
if (position%2==0){
holder.imgBanner.setBackgroundColor(Color.BLUE);
}else {
holder.imgBanner.setBackgroundColor(Color.GREEN);
holder.imgBanner.setImageResource(R.drawable.red_heart);
}
}
#Override
public int getItemCount() {
return 36;
}
public class MyViewHolder extends RecyclerView.ViewHolder {
ImageView imgBanner;
public MyViewHolder(#NonNull View itemView) {
super(itemView);
imgBanner = itemView.findViewById(R.id.imgBanner);
}
}
}
Create one layout file for RecyclerView item
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_margin="2dp"
android:orientation="vertical">
<ImageView
android:id="#+id/imgBanner"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:contentDescription="#string/app_name"
/>
</RelativeLayout>
Try with a padding like this:
<RelativeLayout
android:id="#+id/firstLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="someDp" ->>>> Padding
android:paddingRight="someDp" ->>>> Padding
android:layout_above="#+id/horizontal_divider"
android:layout_below="#id/toolbar"
android:gravity="center">
<TableLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/tblLayout"
android:gravity="center"
android:shrinkColumns="*"
android:padding="0dip"
android:layout_margin="0dip"
android:layout_centerInParent="true"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"></TableLayout>
</RelativeLayout >
Hi I want to create a responsive scrollable grids. As I search, I came across some codes. I tweaked this code to allow scrolling of the grids. The code creates a 2 column grids and 4 rows with cardViews. The cardViews shrinks to allow more cards into the viewport rather than scrolling. Am open to any ideas and alternative methods to make this work.Thanks in advance.
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"
android:scrollbars="vertical"
android:fillViewport="true">
<LinearLayout
android:orientation="vertical"
android:weightSum="10"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_weight="2"
android:layout_width="match_parent"
android:layout_height="0dp">
<TextView
android:id="#+id/textGrid"
android:text="Games"
android:textSize="34sp"
android:textColor="#android:color/black"
android:layout_centerInParent="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</RelativeLayout>
<android.support.v7.widget.GridLayout
android:id="#+id/gridView"
android:layout_weight="8"
app:columnCount="2"
app:rowCount="2"
android:padding="14dp"
app:alignmentMode="alignMargins"
app:columnOrderPreserved="false"
android:layout_width="match_parent"
android:layout_height="0dp"
>
<android.support.v7.widget.CardView
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_marginBottom="16dp"
app:cardCornerRadius="8dp"
app:cardElevation="8dp"
app:layout_columnWeight="1"
app:layout_rowWeight="1">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|center_vertical"
android:layout_margin="16dp"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:src="#drawable/sampleimage" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Grid One
android:textAlignment="center"
android:textColor="#000"
android:textSize="18sp"
android:textStyle="bold" />
</LinearLayout>
</android.support.v7.widget.CardView>
</android.support.v7.widget.GridLayout>
</LinearLayout>
</ScrollView>
I have a pattern like that in one of my apps. Tickets get added to the 3-wide grid and you can scroll the grid. Here is the code I use.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/your_layout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:baselineAligned="false"
android:orientation="vertical">
<ScrollView
android:id="#+id/your_scrollview"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_marginLeft="2dip"
android:layout_gravity="center_horizontal">
<LinearLayout
android:id="#+id/your_grid"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center"
android:gravity="center"
android:orientation="vertical"
android:visibility="visible">
<GridView
android:id="#+id/gridViewTickets"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:numColumns="3"
android:padding="8dp"
android:horizontalSpacing="8dp"
android:verticalSpacing="8dp"
android:minHeight="250dip"
android:gravity="center_horizontal"
android:layout_gravity="center_horizontal">
</GridView>
</LinearLayout>
</ScrollView
</LinearLayout>
After a lot of research I came across RecyclerView. It was a little confusing but it worked fine. I had to use two(2) layouts (activity_main.xml and row_data.xml) with MainActivity.java.
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="MainActivity">
<GridView
android:id="#+id/gridview"
android:numColumns="2"
android:verticalSpacing="1dp"
android:background="#e5e5e5"
android:horizontalSpacing="1dp"
android:layout_width="match_parent"
android:layout_height="wrap_content">
</GridView>
</RelativeLayout>
row_data.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
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="match_parent">
<android.support.v7.widget.CardView
android:id="#+id/gridviewdata"
android:layout_margin="12dp"
app:cardCornerRadius="12dp"
app:cardElevation="6dp"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:layout_centerInParent="true"
>
<LinearLayout
android:orientation="vertical"
android:padding="16dp"
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/images"
android:layout_width="90dp"
android:layout_height="90dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:src="#drawable/apple" />
<TextView
android:id="#+id/fruits"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:text="Apple something"
android:textStyle="normal|italic"
android:textSize="25dp" />
</LinearLayout>
</android.support.v7.widget.CardView>
</RelativeLayout>
MainActivity.java
package com.example.gridrecycler;
import android.content.Intent;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.BaseAdapter;
import android.widget.GridView;
import android.widget.ImageView;
import android.widget.TextView;
public class MainActivity extends AppCompatActivity {
GridView gridView;
String[] fruitNames = {"Apple","Orange","strawberry","Melon","Kiwi","Banana"};
int[] fruitImages = {R.drawable.apple,R.drawable.oranges,R.drawable.strawberry,R.drawable.watermelon,R.drawable.kiwi,R.drawable.banana};
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//finding listview
gridView = findViewById(R.id.gridview);
CustomAdapter customAdapter = new CustomAdapter();
gridView.setAdapter(customAdapter);
gridView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
#Override
public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) {
// Toast.makeText(getApplicationContext(),fruitNames[i],Toast.LENGTH_LONG).show();
Intent intent = new Intent(getApplicationContext(),GridItemActivity.class);
intent.putExtra("name",fruitNames[i]);
intent.putExtra("image",fruitImages[i]);
startActivity(intent);
}
});
}
private class CustomAdapter extends BaseAdapter {
#Override
public int getCount() {
return fruitImages.length;
}
#Override
public Object getItem(int i) {
return null;
}
#Override
public long getItemId(int i) {
return 0;
}
#Override
public View getView(int i, View view, ViewGroup viewGroup) {
View view1 = getLayoutInflater().inflate(R.layout.row_data,null);
//getting view in row_data
TextView name = view1.findViewById(R.id.fruits);
ImageView image = view1.findViewById(R.id.images);
name.setText(fruitNames[i]);
image.setImageResource(fruitImages[i]);
return view1;
}
}
}
I watched diff tuts to come up with this. Am now doubting whether it comforms to best practices. Thanks to you all for your suggestions.
I have an app with MainActivity that contains a FrameLayout which would be replaced by a fragment based on which item is clicked in the bottom layout. I have a fragment named "bookings" that must appear in the body area when "Bookings" option is clicked. The "bookings" fragment contains a spinner and a button that are placed at the center of screen inside of RelativeLayout. When the fragment's layout is placed directly inside of body of MainActivity, the spinner and button is centered, just the way I want it to be.
<RelativeLayout xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/bottompanel"
android:orientation="vertical">
<!-- The FrameLayout goes here -->
<RelativeLayout xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<Spinner
android:id="#+id/city_spinner"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_above="#+id/center_space"
android:layout_marginBottom="10dp"
android:layout_marginTop="10dp"
android:dropDownVerticalOffset="20dp"
android:dropDownWidth="match_parent"
android:popupBackground="#d5ddea"
android:spinnerMode="dropdown" />
<Space
android:id="#+id/center_space"
android:layout_height="0dp"
android:layout_width="match_parent"
android:layout_centerInParent="true"/>
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Done"
android:layout_centerHorizontal="true"
android:layout_below="#+id/center_space"
android:onClick="doneButton" />
</RelativeLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="75dp"
android:orientation="horizontal"
android:layout_alignParentBottom="true"
android:weightSum="3"
android:layout_weight="0"
android:id="#+id/bottompanel">
<LinearLayout
android:id="#+id/profile_button"
android:layout_width="0dp"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1"
android:clickable="true">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_profile"
android:layout_gravity="center"
android:layout_weight="1"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Profile"
android:layout_gravity="center"
android:layout_weight="1"/>
</LinearLayout>
<LinearLayout
android:id="#+id/bookings_button"
android:clickable="true"
android:layout_width="0dp"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_bookings"
android:layout_gravity="center"
android:layout_weight="1"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Bookings"
android:layout_gravity="center"
android:layout_weight="1"/>
</LinearLayout>
<LinearLayout
android:id="#+id/games_button"
android:clickable="true"
android:layout_width="0dp"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_tournaments"
android:layout_gravity="center"
android:layout_weight="1"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Games"
android:layout_gravity="center"
android:layout_weight="1"/>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1">
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1">
</LinearLayout>
</LinearLayout>
</RelativeLayout>
But when I replace the FrameLayout with the fragment, the spinner disappears and the button moves at the top.
Code in activity_main.xml:
<RelativeLayout xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/bottompanel"
android:orientation="vertical">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/fragment_frame"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="75dp"
android:orientation="horizontal"
android:layout_alignParentBottom="true"
android:weightSum="3"
android:layout_weight="0"
android:id="#+id/bottompanel">
<LinearLayout
android:id="#+id/profile_button"
android:layout_width="0dp"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1"
android:clickable="true">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_profile"
android:layout_gravity="center"
android:layout_weight="1"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Profile"
android:layout_gravity="center"
android:layout_weight="1"/>
</LinearLayout>
<LinearLayout
android:id="#+id/bookings_button"
android:clickable="true"
android:layout_width="0dp"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_bookings"
android:layout_gravity="center"
android:layout_weight="1"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Bookings"
android:layout_gravity="center"
android:layout_weight="1"/>
</LinearLayout>
<LinearLayout
android:id="#+id/games_button"
android:clickable="true"
android:layout_width="0dp"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_tournaments"
android:layout_gravity="center"
android:layout_weight="1"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Games"
android:layout_gravity="center"
android:layout_weight="1"/>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1">
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1">
</LinearLayout>
</LinearLayout>
</RelativeLayout>
Code in fragment_bookings.xml:
<RelativeLayout xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<Spinner
android:id="#+id/city_spinner"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_above="#+id/center_space"
android:layout_marginBottom="10dp"
android:layout_marginTop="10dp"
android:dropDownVerticalOffset="20dp"
android:dropDownWidth="match_parent"
android:popupBackground="#d5ddea"
android:spinnerMode="dropdown" />
<Space
android:id="#+id/center_space"
android:layout_height="0dp"
android:layout_width="match_parent"
android:layout_centerInParent="true"/>
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Done"
android:layout_centerHorizontal="true"
android:layout_below="#+id/center_space"
android:onClick="doneButton" />
</RelativeLayout>
Code of onCreateView of bookings.java:
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View v = inflater.inflate(R.layout.fragment_bookings, container, false);
Spinner loc = (Spinner)v.findViewById(R.id.city_spinner);
String[] cities = new String[]{
"Select a City",
"ABC",
"DEF",
"GHI",
"JKL",
"MNO"
};
// Initializing an ArrayAdapter
ArrayAdapter<String> spinnerArrayAdapter = new ArrayAdapter<String>(
this.getActivity(),android.R.layout.simple_spinner_item,cities
);
spinnerArrayAdapter.setDropDownViewResource(android.R.layout.simple_spinner_item);
loc.setAdapter(spinnerArrayAdapter);
loc.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {
#Override
public void onItemSelected(AdapterView<?> adapterView, View view, int pos, long id) {
L1 = id;
}
#Override
public void onNothingSelected(AdapterView<?> adapterView) {
}
});
return v;
}
Code in MainActivity.java:
package com.example.user.temporary;
import android.app.Activity;
import android.net.Uri;
import android.support.v4.app.ActivityCompat;
import android.support.v4.app.FragmentTransaction;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.LinearLayout;
import android.widget.ProgressBar;
import java.io.IOException;
import java.net.HttpURLConnection;
import java.net.URL;
public class MainActivity extends AppCompatActivity implements
profile.OnFragmentInteractionListener,
bookings.OnFragmentInteractionListener,
games.OnFragmentInteractionListener {
private Activity myActivity;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
this.myActivity = this;
LinearLayout profilebtn = (LinearLayout)this.findViewById(R.id.profile_button);
LinearLayout bookingsbtn = (LinearLayout)this.findViewById(R.id.bookings_button);
LinearLayout gamesbtn = (LinearLayout)this.findViewById(R.id.games_button);
profilebtn.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
profile profileFragment = new profile();
FragmentTransaction trans = getSupportFragmentManager().beginTransaction();
trans.replace(R.id.fragment_frame, profileFragment);
trans.setTransition(FragmentTransaction.TRANSIT_FRAGMENT_FADE);
trans.commit();
}
});
bookingsbtn.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
bookings bookings_frame = new bookings();
FragmentTransaction trans = getSupportFragmentManager().beginTransaction();
trans.replace(R.id.fragment_frame, bookings_frame);
trans.setTransition(FragmentTransaction.TRANSIT_FRAGMENT_FADE);
trans.commit();
}
});
gamesbtn.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
games games_frame = new games();
FragmentTransaction trans = getSupportFragmentManager().beginTransaction();
trans.replace(R.id.fragment_frame, games_frame);
trans.setTransition(FragmentTransaction.TRANSIT_FRAGMENT_FADE);
trans.commit();
}
});
}
#Override
public void onFragmentInteraction(Uri uri){
}
}
Change height of FrameLayout to match_parent from wrap_content
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/bottompanel"
android:orientation="vertical">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/fragment_frame"/>
</LinearLayout>
You have match_parent in the height for fragment layout. Try changing it to wrap_content and see if it works
With the layout below the buttons are being shown on top of the page. How can I make them appear below, after the container, down on the page?
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:id="#+id/container"
xmlns:android="http://schemas.android.com/apk/res/android">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_gravity="center_vertical|center_horizontal">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:id="#+id/Main"
android:onClick="ClickHomePage"
android:text= "#string/Home"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:id="#+id/map"
android:onClick="ClickClients"
android:text= "#string/Clients"
>
</Button>
</LinearLayout>
</LinearLayout>
The MainActivity looks as follows and the HomePage.xml is also below
public class MainActivity extends ActionBarActivity
{
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
GetButtonClicked(5);
setContentView(R.layout.activity_main);
}
public void GetButtonClicked(int position)
{
// update the main content by replacing fragments
Fragment fragment = null;
switch (position){
case 0:
fragment= new FirstPageFragment();
break;
default:
fragment = new FirstPageFragment();
break;
}
FragmentManager fragmentManager = getSupportFragmentManager();
fragmentManager.beginTransaction()
.replace(R.id.container, fragment)
.commit();
}
public void ClickHomePage(View view){
GetButtonClicked(0);
}
public void ClickClients(View view){
GetButtonClicked();
}
}
<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="com.test.FirstPageFragment" android:background="#drawable/theme">
</FrameLayout>
This is the FirstPage
public class FirstPageFragment extends Fragment {
public FirstPageFragment() {
// Required empty public constructor
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// Inflate the layout for this fragment
return inflater.inflate(R.layout.fragment_first_page, container, false);
}
}
Use ralative layout insted of linear.
Make a different layout for bottom buttons, and then at the last of your container layout use this:
<include android:id="#+id/bottomLayout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
layout="#layout/bottom_buttons"/>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_alignParentBottom="true"
android:orientation="horizontal" >
<Button
android:id="#+id/Main"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:onClick="ClickHomePage"
android:text="#string/Home" />
<Button
android:id="#+id/map"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:onClick="ClickClients"
android:text="#string/Clients" >
</Button>
</LinearLayout>
Try this
Use RelativeLayout with android:layout_alignParentBottom="true" step by step guide is available here.
Your skeleton for layout should look like this
<RelativeLayout
<LinearLayout android:layout_alignParentBottom="true">
<Button
<Button
</LinearLayout>
</RelativeLayout>
Final Layout
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:gravity="center"
android:orientation="horizontal" >
<Button
android:id="#+id/Main"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:onClick="ClickHomePage"
android:text="Home" />
<Button
android:layout_marginLeft="30dp"
android:id="#+id/map"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:onClick="ClickClients"
android:text="Clients" >
</Button>
</LinearLayout>
The issue was that I did not include the container in another layout...
<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="com.test.MainPageActivityActivity">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal"
android:id="#+id/container">
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal"
android:layout_alignParentTop="#+id/container">
and insert buttons layout here....
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:id="#+id/Main"
android:onClick="ClickHomePage"
android:text= "#string/Home"
/>