how to change fragments when the first fragment is a map activity

Question

I have a map activity, which also contains a navigation drawer layout with items in the drawer. I want to be able to click an item in the drawer, and the item i choose opens an activity. I tried using startActivity to call the class in a separate page, but it distorted my xml file in my emulator. I also tried updateFragment(); but it showed my new class as an error. would anyone know what i can do? this is my MapActivity.java file

public class MapsActivity extends FragmentActivity {

private GoogleMap mMap; 
DrawerLayout drawerLayout;
ListView listView;
ActionBarDrawerToggle drawerToggle;
String[]items;
int selectedPosition=0;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_maps);
    setUpMapIfNeeded();

    items=getResources().getStringArray(R.array.options);
    drawerLayout=(DrawerLayout)findViewById(R.id.drawer_layout);
    listView=(ListView)findViewById(R.id.drawer_list);
    ArrayAdapter<String>adapter=new ArrayAdapter<String>(MapsActivity.this,R.layout.drawer_list_item,items);
    listView.setAdapter(adapter);
    drawerToggle=new ActionBarDrawerToggle(MapsActivity.this,drawerLayout,R.drawable.images,R.string.drawer_open,R.string.drawer_close){
        @Override
        public void onDrawerClosed(View drawerView) {
            super.onDrawerClosed(drawerView);
        }

        @Override
        public void onDrawerOpened(View drawerView) {
            super.onDrawerOpened(drawerView);
        }
    };
    drawerLayout.setDrawerListener(drawerToggle);
   // getActionBar().setHomeButtonEnabled(false);
  //  getActionBar().setDisplayHomeAsUpEnabled(false);
  //  getActionBar().setDisplayShowTitleEnabled(false);
   // getActionBar().setDisplayShowHomeEnabled(false);

    listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
        @Override
        public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
            selectedPosition = position;
            if (selectedPosition==2){
            startActivity(new Intent(MapsActivity.this, MenuActivity.class);

            }

           // updateFragment();
            drawerLayout.closeDrawer(listView);
        }
    });
   // selectedPosition=0;
   // updateFragment();
}

@Override
protected void onResume() {
    super.onResume();
    setUpMapIfNeeded();
}

private void setUpMapIfNeeded() {
    // Do a null check to confirm that we have not already instantiated the map.
    if (mMap == null) {
        // Try to obtain the map from the SupportMapFragment.
        mMap = ((SupportMapFragment) getSupportFragmentManager().findFragmentById(R.id.map))
                .getMap();
        // Check if we were successful in obtaining the map.
        if (mMap != null) {
            setUpMap();
        }
    }
}

private void setUpMap() {
    mMap.addMarker(new MarkerOptions().position(new LatLng(0, 0)).title("Marker"));
}
   private void updateFragment() {
    FragmentManager fragmentManager=getFragmentManager();
    WebViewFragment rFragment=new WebViewFragment();

    Bundle data=new Bundle();
    data.putString("title",items[selectedPosition]);
    rFragment.setArguments(data);
    FragmentTransaction ft=fragmentManager.beginTransaction();
    ft.replace(R.id.content_frame,rFragment);
    ft.commit();



}

@Override
protected void onPostCreate(Bundle savedInstanceState) {
    super.onPostCreate(savedInstanceState);
    drawerToggle.syncState();
}
}

My MenuActivity.xml

<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.example.xxxxxx.qdoba.MenuFragment">

<!-- TODO: Update blank fragment layout -->
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent" android:layout_height="match_parent"
    android:background="@drawable/woodcrop">


    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:text="MENU"
        android:id="@+id/textView"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:textStyle="bold"
        android:textSize="60dp"
        android:textColor="#ff912424" />

    <LinearLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_centerVertical="true"
        android:layout_centerHorizontal="true">

        <LinearLayout
            android:orientation="horizontal"
            android:layout_width="match_parent"
            android:layout_height="140dp"
            android:layout_marginTop="100dp">

            <ImageView
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:id="@+id/imageView"
                android:layout_marginTop="20dp"
                android:layout_marginLeft="20dp" />

            <ImageView
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:id="@+id/imageView2" 
                android:layout_marginTop="20dp"
                android:layout_marginLeft="30dp" />

            <ImageView
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:id="@+id/imageView3"
                android:layout_marginTop="20dp"
                android:layout_marginLeft="30dp" />
        </LinearLayout>

        <LinearLayout
            android:orientation="horizontal"
            android:layout_width="match_parent"
            android:layout_height="140dp"
            android:layout_gravity="center_horizontal">
            <ImageView
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:id="@+id/imageView4"
                android:layout_marginTop="20dp"
                android:layout_marginLeft="20dp" />

            <ImageView
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:id="@+id/imageView5"
                android:layout_marginTop="20dp"
                android:layout_marginLeft="30dp" />

            <ImageView
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:id="@+id/imageView6"
                android:layout_marginTop="20dp"
                android:layout_marginLeft="30dp" />
        </LinearLayout>

        <LinearLayout
            android:orientation="horizontal"
            android:layout_width="match_parent"
            android:layout_height="140dp"
            android:layout_gravity="center_horizontal">
            <ImageView
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:id="@+id/imageView7"
                android:layout_marginTop="20dp"
                android:layout_marginLeft="20dp" />

            <ImageView
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:id="@+id/imageView8"
                android:layout_marginTop="20dp"
                android:layout_marginLeft="30dp" />

            <ImageView
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:id="@+id/imageView9"
                android:layout_marginTop="20dp"
                android:layout_marginLeft="30dp" />
        </LinearLayout>

        <LinearLayout
            android:orientation="horizontal"
            android:layout_width="match_parent"
            android:layout_height="140dp"
            android:layout_gravity="center_horizontal">
            <ImageView
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:id="@+id/imageView10"
                android:layout_marginTop="20dp"
                android:layout_marginLeft="20dp" />

            <ImageView
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:id="@+id/imageView11"
                android:layout_marginTop="20dp"
                android:layout_marginLeft="30dp" />

            <ImageView
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:id="@+id/imageView12"
                android:layout_marginTop="20dp"
                android:layout_marginLeft="30dp" />
        </LinearLayout>
    </LinearLayout>

</RelativeLayout>

this is how it looks in the preview;

this is how it looks on the emulator :(

one image:

So, as far as I understand you try to start Activity from the drawer. And whats the problem? Which of layout have been distorted - MapActivity layout or MenuActivity layout? Maybe you provide screenshots and layouts files? — kolombo, Aug 31 '15 at 22:01
the MenuActivity xml layout is distorted when i try to use startActivity to launch that activity in the MapsActivity. — Aria, Aug 31 '15 at 22:07
is MenuActivity layout looks correctly on preview? Provide MenuActivity layout. And it would be better if you provide screenshots also. — kolombo, Aug 31 '15 at 22:11
i have added =the xml file, will add the screenshots in a minute — Aria, Aug 31 '15 at 22:24
I think you used android:layout_width="100dp" for every image view, so the final width of this layout bigger than screen width of device. You need to refactor the layout. For example i think you better use TableLayout with 3 columns with scratch parameter, instead of LinearLayout and hardcoded dp of width. — kolombo, Aug 31 '15 at 22:36
i haven't used table layout before. do i have to use it with table row or do i just add the image views ? — Aria, Aug 31 '15 at 22:41
You need used it with TableRow. Something like [that](https://codeshare.io/Z9sjw). Or probably you can use GridLayout. Try. — kolombo, Aug 31 '15 at 22:50
Do not run the application. Set screen preview from Nexus 6 to Nexus One with 3.7 inch display and achive normal solution. Give me one of your image your are placed in ImageView, I will try. — kolombo, Aug 31 '15 at 23:24

kolombo · Accepted Answer · 2015-09-01T00:25:21.690

It happens because you are using layout_width="100dp" for every image view and 20dp of margin, so the final width of your layout bigger than screen width of device. You can see it if you change preview from Nexus 6 to Nexus One, for example.
You can use layout_weight parameter for every image or TableLayout with 3 columns, or you may try to use GridLayout.
Try this, for example.

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <ImageView
        android:id="@+id/imageView"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:layout_weight="1"
        android:minHeight="50dp"
        />

    <ImageView
        android:id="@+id/imageView2"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:layout_weight="1"
        android:minHeight="50dp"
        />

    <ImageView
        android:id="@+id/imageView3"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:layout_weight="1"
        android:minHeight="50dp"
        />
</LinearLayout>

Or with same effect

<TableLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_below="@+id/textView"
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            android:stretchColumns="*">

            <TableRow
                android:layout_width="match_parent"
                android:layout_height="match_parent">

                <ImageView
                    android:id="@+id/imageView"
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:layout_margin="10dp"
                    android:layout_weight="1"
                    android:minHeight="50dp"
                    />

                <ImageView
                    android:id="@+id/imageView2"
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:layout_margin="10dp"
                    android:layout_weight="1"
                    android:minHeight="50dp"
                    />

                <ImageView
                    android:id="@+id/imageView3"
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:layout_margin="10dp"
                    android:layout_weight="1"
                    android:minHeight="50dp"
                    />
            </TableRow>
//your other rows
</TableLayout>

how to change fragments when the first fragment is a map activity

1 Answers1