Alternatives Tablet Layout mit Fragments

  • 6 Antworten
  • Neuester Beitrag
Diskutiere Alternatives Tablet Layout mit Fragments im Android App Entwicklung im Bereich Betriebssysteme & Apps.
H

Hin

Stammgast
Hallo,

meine Frage ist wahrscheinlich recht einfach zu beantworten. Ich habe leider aber bisher quasi nichts mit Fragments gearbeitet und bin auch nach längerer Websuche zu keiner einfachen Lösung gekommen.

Ich möchte ein Layout wie es in der Skizze dargestellt ist. Im Prinzip sollen die Fragments nur einfache vertikal scrollbare ListViews sein. Auf dem Smartphone möchte ich zwischen diesen per swipe wechseln, auf dem Tablet sollen beide nebeneinander dargestellt werden.

Das Smartphone Layout habe ich schon hinbekommen, das macht der Eclipse Assistent ja schon fast von alleine. Das wechseln zwischen zwei Layouts habe ich auch schon hinbekommen durch Verwendung eines zweiten Layout XML files.

Es geht mir jetzt im wesentlichen darum wie ich das Tablet Layout in XML definieren kann, dass mein Code Problemlos damit weiter Arbeiten kann und ich dort keine Rücksicht auf die Displaygröße nehmen muss.

Wahrscheinlich unwichtig, aber hier noch mein aktueller Code (zu 99% von Eclipse generiert):
Bisheriges XML:
HTML:
<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"
    tools:context=".MyApp" >

    <!--
    This title strip will display the currently visible page title, as well as the page
    titles for adjacent pages.
    -->

    <android.support.v4.view.PagerTitleStrip
        android:id="@+id/pager_title_strip"
        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>
Bisheriger Code:
Code:
package com.shappdev.android.lansync;

import android.os.Bundle;
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.NavUtils;
import android.support.v4.view.ViewPager;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;

public class MyApp extends FragmentActivity {

    /**
     * The {@link android.support.v4.view.PagerAdapter} that will provide
     * fragments for each of the sections. We use a
     * {@link android.support.v4.app.FragmentPagerAdapter} derivative, which
     * will keep every loaded fragment in memory. If this becomes too memory
     * intensive, it may be best to switch to a
     * {@link android.support.v4.app.FragmentStatePagerAdapter}.
     */
    SectionsPagerAdapter mSectionsPagerAdapter;

    /**
     * The {@link ViewPager} that will host the section contents.
     */
    ViewPager mViewPager;

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

        // Create the adapter that will return a fragment for each of the two
        // primary sections of the app.
        mSectionsPagerAdapter = new SectionsPagerAdapter(
                getSupportFragmentManager());

        // Set up the ViewPager with the sections adapter.
        mViewPager = (ViewPager) findViewById(R.id.pager);
        mViewPager.setAdapter(mSectionsPagerAdapter);

    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.activity_my_app, menu);
        return true;
    }

    /**
     * A {@link FragmentPagerAdapter} that returns a fragment corresponding to
     * one of the sections/tabs/pages.
     */
    public class SectionsPagerAdapter extends FragmentPagerAdapter {

        public SectionsPagerAdapter(FragmentManager fm) {
            super(fm);
        }

        @Override
        public Fragment getItem(int position) {
            // getItem is called to instantiate the fragment for the given page.
            // Return a DummySectionFragment (defined as a static inner class
            // below) with the page number as its lone argument.
            Fragment fragment = new DummySectionFragment();
            Bundle args = new Bundle();
            args.putInt(DummySectionFragment.ARG_SECTION_NUMBER, position + 1);
            fragment.setArguments(args);
            return fragment;
        }

        @Override
        public int getCount() {
            // Show 2 total pages.
            return 2;
        }

        @Override
        public CharSequence getPageTitle(int position) {
            switch (position) {
            case 0:
                return getString(R.string.title_section1).toUpperCase();
            case 1:
                return getString(R.string.title_section2).toUpperCase();
            }
            return null;
        }
    }

    /**
     * A dummy fragment representing a section of the app, but that simply
     * displays dummy text.
     */
    public static class DummySectionFragment extends Fragment {
        /**
         * The fragment argument representing the section number for this
         * fragment.
         */
        public static final String ARG_SECTION_NUMBER = "section_number";

        public DummySectionFragment() {
        }

        @Override
        public View onCreateView(LayoutInflater inflater, ViewGroup container,
                Bundle savedInstanceState) {
            // Create a new TextView and set its text to the fragment's section
            // number argument value.
            TextView textView = new TextView(getActivity());
            textView.setGravity(Gravity.CENTER);
            textView.setText(Integer.toString(getArguments().getInt(
                    ARG_SECTION_NUMBER)));
            return textView;
        }
    }

}

Ich hoffe mir kann jemand weiter helfen. Mir fehlt wie gesagt eigentlich nur das passende XML-Tag für das Layout.
 

Anhänge

H

Hin

Stammgast
Man verzeihe mir den Doppelpost, aber ich denke so ist es übersichtlicher.

Ich habe nun einen Workaround gefunden. Diese Lösung ist nicht besonders schön und ich wäre immer noch für eine andere Lösung dankbar, aber vielleicht hilft sie ja jemandem irgendwann mal weiter.

Ich habe meinen FragmentPagerAdapter um foldende Methode erweitert:
Code:
@Override
        public float getPageWidth(int position) {
            Configuration config = getResources().getConfiguration();
            if (config.screenWidthDp >= 480) {
                return 0.5f;
            } else {
                return super.getPageWidth(position);
            }
        }
Dies bewirkt, dass die Fragments nur noch die Hälfte des Platzes einnehmen und somit zwei auf den Bildschirm passen (mehr dazu).

Zudem habe ich die XML, die ab 480dp verwendet wird wie folgt angepasst:
HTML:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="vertical" 
        android:gravity="top"
        android:layout_width="fill_parent" 
        android:layout_height="match_parent">

    <LinearLayout 
        android:orientation="horizontal"
        android:gravity="center_horizontal" 
        android:layout_width="fill_parent" 
        android:layout_height="wrap_content"
        android:layout_weight="0">
        
        <TextView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="left"
            android:layout_weight="1"
            android:background="#33b5e5"
            android:padding="4dp"
            android:gravity="center"
            android:text="fragment1"
            android:textColor="#fff" />

        <TextView 
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="right"
            android:layout_weight="1"
            android:background="#33b5e5"
            android:padding="4dp"
            android:gravity="center"
            android:textColor="#fff"
            android:text="fragment2"/>
        
    </LinearLayout>
    
    <android.support.v4.view.ViewPager
            android:id="@+id/pager"
            android:layout_width="match_parent"
            android:layout_height="0px"
            android:layout_weight="1">
    </android.support.v4.view.ViewPager>
    
</LinearLayout>
Die eigentliche Anzeige des aktuellen Fragments wird also augeblendet (ist 0 Pixel hoch) und stattdessen habe ich sie quasi selbst nachgebaut.

Aber wie gesagt, falls jemand eine schöne Lösung für das Problem kennt, würde ich mich über eine Antwort freuen. :smile:
 
StefMa

StefMa

Experte
Mach dir mal ein neues Projekt und nimm als "standard"-Layout das "MasterDetail-Flow"
Schau dir den generierten Code an. Wenn du den verstanden hast, kannst du dich wieder an dein Projekt wagen.

Hier habe ich auch noch ein Blog für dich:
http://x.co/rsbj

Gruß
 
H

Hin

Stammgast
Danke, aber ich glaube nicht, dass das das ist, was ich brauche. MasterDetail-Flow bietet mir doch ein Layout, wie man es zB aus den Android Einstellungen kennt. Also die linke Spalte bietet eine Übersicht und die rechte Spalte bietet dann weiteres zu dem aktuell gewählten Punkt aus der linken Spalte.

Bei mir sind die zwei Spalten aber voneinander unabhängig vergleichbar mit einem Dateiexplorer mit zwei Fenstern. Die Spalten möchte ich eben nebeneinander darstellen, sofern genug Platz in der Breite ist. Ansonsten soll man zwischen den Spalten mit einem Wischen wechseln können.
 
blackfire185

blackfire185

Stammgast
Naja du kannst ja 2 Layouts definieren und wie im workaround am Anfang die breite abfragen und mit setcontentview das richtige Layout setzen.

Gesendet von meinem GT-S5660 mit der Android-Hilfe.de App
 
StefMa

StefMa

Experte
Wollte dir eigentlich nur das hier zeigen:
Of interest in this case are the values-large and the values-sw600dp folders. Both contain a file named refs.xml which references the activity_item_twopane.xml file:

Note the name attribute of the reference. Its value is activity_item_list. This means that when you use R.layout.activity_item_list in your code, Android will replace this value with R.layout.activity_item_twopane. Of course only if one of the two qualifiers large or sw600dp applies. That way you have to declare the layout only once and can refer to it in multiple places.
 
H

Hin

Stammgast
Danke euch beiden, aber wie ich im ersten Post schon geschrieben habe, bereitet mir das automatische auswählen der korrekten XML kein Problem.

Hin schrieb:
Das wechseln zwischen zwei Layouts habe ich auch schon hinbekommen durch Verwendung eines zweiten Layout XML files.
Es ging mir eher darum, ob man dem ViewPager nicht mitteilen kann, dass ich zwei Fragmente auf einmal anzeigen will. Ich habe das eben nun mit dem Workaround umgangen, dass die Fragmente nur noch die halbe Bildschirmbreite einnehmen dürfen (wobei dabei auch die ViewPager Anzeige nicht mehr korrekt funktioniert hat und ich auch diese anpassen musste).
 
Ähnliche Themen - Alternatives Tablet Layout mit Fragments Antworten Datum
4
4