Showing Dialog With View Pager with Pager Strip
Hello coders....Today I am going to share the code for the dialog with PagerStrip.I have seen many demos for this but none of them having the dialog dismiss functionality on click on any widget.Here is the code,hope it will be helpful for you:
-> First make a layout named activity_main.xml which having a button by clicking on it dialog will be shown:
<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" >
<Button android:layout_width="100dp"
android:layout_height="100dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:id="@+id/btn_center"/>
</RelativeLayout>
-> Second Step is to make another layout for dialog named simple_tabs.xml:
<android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- Current + adjacent page titles...-->
<android.support.v4.view.PagerTitleStrip
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:background="#33b5e5"
android:paddingBottom="4dp"
android:paddingTop="4dp"
android:textColor="#fff" />
</android.support.v4.view.ViewPager>
->Third Step is to design layout of single view in View Pager ,I have shown here 2 view with two pager strip and used same layout for both,you can used different layouts for each obliviously,I have named this layout: simple_fragment.xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:id="@+id/textView1kk"
android:layout_width="wrap_content"
android:layout_height="45dp"
android:text="First 1"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="@+id/textView1"
android:layout_width="wrap_content"
android:layout_height="45dp"
android:text="First 2"
android:textAppearance="?android:attr/textAppearanceMedium" />
</LinearLayout>
-> Now let's move the source class I have nemed it Second.java ,and I have made all the coding (call fragment,set adapter ,etc.)in one class.You can also make it in another classes.
import com.exppp.FragmentDialog.MyFragmentAdapter;
import android.os.Bundle;
import android.annotation.SuppressLint;
import android.app.Activity;
import android.support.v4.app.DialogFragment;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.app.FragmentTransaction;
import android.support.v4.view.ViewPager;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.TextView;
@SuppressLint("ValidFragment")
public class Second extends FragmentActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Button btn_center = (Button)findViewById(R.id.btn_center);
btn_center.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
showTheDialog();
}
});
}
protected void showTheDialog() {
FragmentDialog f = new FragmentDialog();
FragmentTransaction ft = getSupportFragmentManager().beginTransaction();
ft.add(f,"fragment_dialog");
ft.commit();
}
public class FragmentDialog extends DialogFragment{
//content to show in the fragments
public static final String TAG = "fragment_dialog";
final int[] images = new int[]{R.drawable.ic_launcher, R.drawable.ic_launcher};
public FragmentDialog(){
}
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.simple_tabs, container);
getDialog().setTitle("Pager Dialog");
ViewPager pager = (ViewPager) view.findViewById(R.id.pager);
MyFragmentAdapter adapter = new MyFragmentAdapter(getChildFragmentManager());
pager.setAdapter(adapter);
return view;
}
public void Dismiss()
{
getDialog().dismiss();
}
public class MyFragmentAdapter extends FragmentPagerAdapter
{
public MyFragmentAdapter(FragmentManager fm) {
super(fm);
}
@Override
public Fragment getItem(int position) {
if (position == 0)
{
// find first fragment...
SimpleFragment s=new SimpleFragment();
return s;
}
if (position == 1)
{
// find second fragment...
Secondfragment s=new Secondfragment();
return s;
}
return null;
}
@Override
public int getCount() {
// Show 2 total pages.
return 2;
}
@Override
public CharSequence getPageTitle(int position) {
switch (position) {
case 0:
return "First Tab";
case 1:
return "Second Tab";
}
return null;
}
}
}
public class SimpleFragment extends Fragment{
int id;
public static final String ID_BUNDLE = "bundle";
@SuppressLint("ValidFragment")
public SimpleFragment(){
}
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
// Inflate the layout for this fragment
View v = inflater.inflate(R.layout.simple_fragment, container, false);
FragmentActivity mAct = getActivity();
TextView img = (TextView) v.findViewById(R.id.textView1kk);
img.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//this is used to dismiss the dialog
Fragment prev = getSupportFragmentManager().findFragmentByTag("fragment_dialog");
if (prev != null) {
DialogFragment df = (DialogFragment) prev;
df.dismiss();
}
}
});
return v;
}
}
public class Secondfragment extends Fragment{
int id;
public static final String ID_BUNDLE = "bundle";
@SuppressLint("ValidFragment")
public Secondfragment(){
}
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
// Inflate the layout for this fragment
View v = inflater.inflate(R.layout.seconddialog, container, false);
FragmentActivity mAct = getActivity();
TextView txt = (TextView) v.findViewById(R.id.txtsec);
txt.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//this is used to dismiss the dialog
Fragment prev = getSupportFragmentManager().findFragmentByTag("fragment_dialog");
if (prev != null) {
DialogFragment df = (DialogFragment) prev;
df.dismiss();
}
}
});
return v;
}
}
}
->That's all.It will show view pager with pager strip with length 2 means 2 views in dialog,you can add add fragments and change layouts according to your need. happy coding....
No comments:
Post a Comment