Android Scrollview and layout problems - android-layout

Question

I have a question regarding android layouts. I cannot achieve what I am looking for and I need some direction.
I am looking for a layout that will be inside a Scroll View layout. its hard to explain but a picture is worth thousand words.enter image description here
I want this inside a scroll view, can any help please?

Answer 1

If you do not want to add images dynamically than this is the layout you want Try this.
activity_main.xml :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ScrollView
android:id="#+id/sv"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/linMain"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:orientation="horizontal">
<RelativeLayout
android:id="#+id/lin1"
android:layout_width="100dp"
android:layout_height="match_parent"
android:layout_margin="10dp">
<ImageView
android:id="#+id/imgView1"
android:layout_width="100dp"
android:layout_height="100dp"
android:background="#android:color/holo_purple" />
<ImageView
android:id="#+id/imgView2"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_below="#id/imgView1"
android:layout_marginTop="20dp"
android:background="#android:color/holo_red_light" />
<ImageView
android:id="#+id/imgView3"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_below="#id/imgView2"
android:layout_marginTop="20dp"
android:background="#android:color/holo_green_light" />
<ImageView
android:id="#+id/imgView4"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_below="#id/imgView3"
android:layout_marginTop="20dp"
android:background="#android:color/holo_blue_light" />
</RelativeLayout>
<LinearLayout
android:id="#+id/lin2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:orientation="vertical">
<WebView
android:id="#+id/webView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_toRightOf="#id/linImages"></WebView>
</LinearLayout>
</LinearLayout>
</ScrollView>
</RelativeLayout>
Here i am attaching screenshot of this layout UI.

Answer 2

Try this,I have made two layouts ..
1) activity_main that contains gridview and webview.
2)activity_gridview which contains imageview which will inflate in gridview.
I have added images dynamically to Gridview using BaseAdapter.
In MainActivity i have set that Adapter to GridView. Try this code once.
activity_main.xml :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ScrollView
android:id="#+id/scrollView"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:fillViewport="false"
android:orientation="vertical">
<LinearLayout
android:id="#+id/linImages"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/grid"
android:layout_width="100dp"
android:layout_height="match_parent"
android:numColumns="1"></GridView>
<WebView
android:id="#+id/webView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_toRightOf="#id/linImages"></WebView>
</LinearLayout>
</ScrollView>
</RelativeLayout>
activity_gridview.xml :
<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/imgView1"
android:layout_width="100dp"
android:layout_height="100dp"
android:background="#drawable/star2" />
<ImageView
android:id="#+id/imgView2"
android:layout_width="100dp"
android:layout_height="100dp"
android:background="#drawable/star1" />
<ImageView
android:id="#+id/imgView3"
android:layout_width="100dp"
android:layout_height="100dp"
android:background="#drawable/star3" />
<ImageView
android:id="#+id/imgView4"
android:layout_width="100dp"
android:layout_height="100dp"
android:background="#drawable/star1" />
</LinearLayout>
CustomAdapter.java :
public class CustomAdapter extends BaseAdapter {
Context context;
int flags[];
LayoutInflater inflter;
public CustomAdapter(Context applicationContext, int[] flags) {
this.context = applicationContext;
this.flags = flags;
inflter = (LayoutInflater.from(applicationContext));
}
#Override
public int getCount() {
return flags.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 = inflter.inflate(R.layout.activity_gridview, null);
ImageView imgView1 = (ImageView) view.findViewById(R.id.imgView1);
ImageView imgView2 = (ImageView) view.findViewById(R.id.imgView2);
ImageView imgView3 = (ImageView) view.findViewById(R.id.imgView3);
ImageView imgView4 = (ImageView) view.findViewById(R.id.imgView4);
imgView1.setImageResource(flags[0]);
imgView2.setImageResource(flags[1]);
imgView3.setImageResource(flags[2]);
imgView4.setImageResource(flags[3]);
return view;
}
}
MainActivity.java :
public class MainActivity extends AppCompatActivity {
int images[] = {R.drawable.star2, R.drawable.star1, R.drawable.star3, R.drawable.star1};
GridView grid;
CustomAdapter customAdapter;
WebView webView;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
webView= (WebView) findViewById(R.id.webView);
grid = (GridView) findViewById(R.id.grid);
customAdapter = new CustomAdapter(getApplicationContext(), images);
grid.setAdapter(customAdapter);
}
}