In this tutorial, I will explain how to use SlidingPaneLayout. It’s an interesting component which can be used whenever we want a multi-pane horizontal layout in our app. It is divided in two different parts:
left side: The master pane which usually contains a list of values.
right side: The detail pane which usaully contains the details of the values in the left side.
In short you can say that left pane is treated as a content list or browser or as a subordinate to a primary detail view for displaying content. SlidingPaneLayout can be used to fragment or other components, we just need to make sure that in our main layout it has to be the root.
Let’s have a look on how to write code for all which we have discussed above. Please follow the steps below:
Step1: Create a new android project in your android IDE.
Step2:Write following into you layout file:
<android.support.v4.widget.SlidingPaneLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" > <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" > <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Pane A" android:textStyle="bold" /> <ImageView android:layout_width="match_parent" android:layout_height="match_parent" android:src="@drawable/thumb" /> </LinearLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:background="#101010" android:orientation="vertical" > <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Pane B" android:textColor="#C0C0C0" android:textStyle="italic|bold" /> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/ic_launcher" /> </LinearLayout> </android.support.v4.widget.SlidingPaneLayout>
Step3: Your java file should be like below:
package com.example.slidingpaneexample; import android.support.v7.app.ActionBarActivity; import android.os.Bundle; import android.view.Menu; import android.view.MenuItem; public class MainActivity extends ActionBarActivity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); } @Override public boolean onCreateOptionsMenu(Menu menu) { // Inflate the menu; this adds items to the action bar if it is present. getMenuInflater().inflate(R.menu.menu_main, menu); return true; } @Override public boolean onOptionsItemSelected(MenuItem item) { // Handle action bar item clicks here. The action bar will // automatically handle clicks on the Home/Up button, so long // as you specify a parent activity in AndroidManifest.xml. int id = item.getItemId(); //noinspection SimplifiableIfStatement if (id == R.id.action_settings) { return true; } return super.onOptionsItemSelected(item); } }
Step4: Run for the output shown below:
Check my previous on Customized Toast Messages.
Top 10 Android App Development Trends | 2020 Guide
5 Best Resources to Get Started with Android Nougat
Android Studio Introduction
Services – An Android Component
Applying MediaCodec On An Open Source Android Audio Player
5 Most Used Android Testing Frameworks
Android Language Highlights A Developers Perspective
Android KitKat Development