如何在不使用卡的情况下在Android Wear中使用GridViewPager？

Question

I'm brand new to android development and I'm trying to create a layout in android wear without using the cards that are used in the sample code. I think I need to use a Fragment to do this, but I can't figure out how to get around using a CardFragment. Here's my code so far:

MyGridViewPagerAdapter

import android.app.Fragment;
import android.app.FragmentManager;
import android.content.Context;
import android.support.wearable.view.CardFragment;
import android.support.wearable.view.FragmentGridPagerAdapter;
import android.support.wearable.view.ImageReference;
import android.view.Gravity;

/**
 * Constructs fragments as requested by the GridViewPager. For each row a
 * different background is provided.
 */
public class MyGridViewPagerAdapter extends FragmentGridPagerAdapter {

    private final Context mContext;

    public MyGridViewPagerAdapter(Context ctx, FragmentManager fm) {
        super(fm);
        mContext = ctx;
    }

    static final int[] BG_IMAGES = new int[] {
            R.drawable.bg
    };

    /** A simple container for static data in each page */
    private static class Page {
        int titleRes;
        int textRes;
        int iconRes;
        int cardGravity = Gravity.BOTTOM;
        boolean expansionEnabled = true;
        float expansionFactor = 1.0f;
        int expansionDirection = CardFragment.EXPAND_DOWN;

        public Page(int titleRes) {
            this(titleRes, textRes, 0);
            this.expansionEnabled = expansion;
        }

        public Page(int titleRes, int textRes, boolean expansion, float expansionFactor) {
            this(titleRes, textRes, 0);
            this.expansionEnabled = expansion;
            this.expansionFactor = expansionFactor;
        }

        public Page(int titleRes, int textRes, int iconRes) {
            this.titleRes = titleRes;
            this.textRes = textRes;
            this.iconRes = iconRes;
        }

        public Page(int titleRes, int textRes, int iconRes, int gravity) {
            this.titleRes = titleRes;
            this.textRes = textRes;
            this.iconRes = iconRes;
            this.cardGravity = gravity;
        }
    }

    // Create a static set of pages in a 2D array
    private final Page[][] PAGES = {
            {
                    new Page(R.drawable.tuner),
            },
            {
                    new Page(R.drawable.metronome),
                    new Page(R.drawable.metroplain),
            },
    };

    @Override
    public Fragment getFragment(int row, int col) {
        Page page = PAGES[row][col];
        String title =
                page.titleRes != 0 ? mContext.getString(page.titleRes) : null;
        String text =
                page.textRes != 0 ? mContext.getString(page.textRes) : null;
        CardFragment fragment = CardFragment.create(title, text, page.iconRes);

        // Advanced settings (card gravity, card expansion/scrolling)
        fragment.setCardGravity(page.cardGravity);
        fragment.setExpansionEnabled(page.expansionEnabled);
        fragment.setExpansionDirection(page.expansionDirection);
        fragment.setExpansionFactor(page.expansionFactor);
        return fragment;
    }


    // Obtain the background image for the page at the specified position
    @Override
    public ImageReference getBackground(int row, int column) {
        return ImageReference.forDrawable(BG_IMAGES[row % BG_IMAGES.length]);
    }
// Obtain the number of pages (vertical)
    @Override
    public int getRowCount() {
        return PAGES.length;
    }
// Obtain the number of pages (horizontal)
    @Override
    public int getColumnCount(int rowNum) {
        return PAGES[rowNum].length;
    }
}

Main

import android.app.Activity;
import android.content.res.Resources;
import android.os.Bundle;
import android.support.wearable.view.GridViewPager;
import android.view.View;
import android.view.View.OnApplyWindowInsetsListener;
import android.view.WindowInsets;

public class Main extends Activity {

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.grid);
    final Resources res = getResources();
    final GridViewPager pager = (GridViewPager) findViewById(R.id.pager);
    pager.setOnApplyWindowInsetsListener(new OnApplyWindowInsetsListener() {
        @Override
        public WindowInsets onApplyWindowInsets(View v, WindowInsets insets) {
            // Adjust page margins:
            //   A little extra horizontal spacing between pages looks a bit
            //   less crowded on a round display.
            final boolean round = insets.isRound();
            int rowMargin = res.getDimensionPixelOffset(R.dimen.page_row_margin);
            int colMargin = res.getDimensionPixelOffset(round ?
                    R.dimen.page_column_margin_round : R.dimen.page_column_margin);
            pager.setPageMargins(rowMargin, colMargin);

            // GridViewPager relies on insets to properly handle
            // layout for round displays. They must be explicitly
            // applied since this listener has taken them over.
            pager.onApplyWindowInsets(insets);
            return insets;
        }
    });
    pager.setAdapter(new MyGridViewPagerAdapter(this, getFragmentManager()));
  }
}

Thanks for your help!

Answer 1

In your adapter, give your fragments as following:

private final Activity mContext;
private final Fragment[][] mFragment;

public MyGridViewPagerAdapter(Activity ctx, FragmentManager fm, Fragment[][] fragments)
{
    super(fm);
    mContext = ctx;
    this.mFragment = fragments;
}

then override the getFragment method as following:

@Override
public Fragment getFragment(int row, int col)
{
    return mFragment[row][col];
}

then in your activity do as following:

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

    final GridViewPager pager = (GridViewPager) findViewById(R.id.pager);
    final Fragment[][] items = {
            {
                    CusmtomFragment.newInstance("your","arguments"),
                    CusmtomFragment.newInstance()
            },
            {
                    OtherFragment.newInstance(),
                    AnotherFragment.newInstance(1234)
            }
    };
    // ....
    pager.setAdapter(new MyGridViewPagerAdapter(this, getFragmentManager(), items));
}

Hope it helps !

Answer 2

You can extend GridPagerAdapter instead of FragmentGridPagerAdapter.

For example:

 public class MyGridViewPagerAdapter extends GridPagerAdapter { public MyGridViewPagerAdapter (final Context context) { ... } @Override public int getRowCount() { ... } @Override public int getColumnCount(int i) { ... } @Override public int getCurrentColumnForRow(int row, int currentColumn) { ... } @Override protected Object instantiateItem(ViewGroup viewGroup, int row, int col) { ... } } 

Pay close attention to the instantiateItem method. You should be using it to return a custom view (ie ImageView or XML View Layout) for your pages.

For a more detailed explanation and further reading, you can follow the below link which explains things in more detail:

http://www.learnandroidwear.com/sample-3

Best of luck, Andrew