1

在我的一项活动中,我想要一个类似“菜单栏”的东西,在纵向模式下位于屏幕底部,在横向模式下位于屏幕右侧。

菜单栏是永久可见的,并且将容纳具有相同高度但可能具有不同宽度的图像按钮。根据“菜单栏”中“按钮”的数量选择适当的填充,以便正确使用可用的高度或宽度。基本上它应该是这样的:

肖像 景观

正如这里所建议的,我已经考虑过使用“拆分操作栏” 。但在这种情况下,我只有在纵向模式下才有想要的效果。

目前我考虑实现一个自定义的gridview布局来获得这个效果,或者修改在这里找到的仪表板模式。

也许你们中的一些人已经实现了“菜单栏式布局”之类的东西,可以为我指明正确的方向。

编辑

我稍微修改了上面提到的仪表板模式代码,这只是概念的第一个证明,但似乎符合我的意图:

public class Nx1Layout extends ViewGroup {

private static final String TAG = "Nx1Layout";
private int mMaxChildWidth = 0;
private int mMaxChildHeight = 0;
private int mScreenOrientation = Configuration.ORIENTATION_PORTRAIT;

public Nx1Layout(Context context) {
    super(context, null);
}

public Nx1Layout(Context context, AttributeSet attrs) {
    super(context, attrs, 0);
}

public Nx1Layout(Context context, AttributeSet attrs, int defStyle) {
    super(context, attrs, defStyle);
}

public void setScreenOrientation(int screenOrientation) {
    mScreenOrientation = screenOrientation;
}

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
    mMaxChildWidth = 0;
    mMaxChildHeight = 0;

    // Measure once to find the maximum child size.
    int childWidthMeasureSpec = MeasureSpec.makeMeasureSpec(MeasureSpec.getSize(widthMeasureSpec), MeasureSpec.AT_MOST);
    int childHeightMeasureSpec = MeasureSpec.makeMeasureSpec(MeasureSpec.getSize(heightMeasureSpec), MeasureSpec.AT_MOST);
    final int count = getChildCount();
    for (int i = 0; i < count; i++) {
        final View child = getChildAt(i);
        if (child.getVisibility() == GONE) {
            continue;
        }

        child.measure(childWidthMeasureSpec, childHeightMeasureSpec);

        mMaxChildWidth = Math.max(mMaxChildWidth, child.getMeasuredWidth());
        mMaxChildHeight = Math.max(mMaxChildHeight, child.getMeasuredHeight());
    }

    // Measure again for each child to be exactly the same size.
    childWidthMeasureSpec = MeasureSpec.makeMeasureSpec(mMaxChildWidth, MeasureSpec.EXACTLY);
    childHeightMeasureSpec = MeasureSpec.makeMeasureSpec(mMaxChildHeight, MeasureSpec.EXACTLY);
    for (int i = 0; i < count; i++) {
        final View child = getChildAt(i);
        if (child.getVisibility() == GONE) {
            continue;
        }

        child.measure(childWidthMeasureSpec, childHeightMeasureSpec);
    }
    setMeasuredDimension(resolveSize(mMaxChildWidth, widthMeasureSpec),resolveSize(mMaxChildHeight, heightMeasureSpec));
}

@Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {
    int width = r - l;
    int height = b - t;

    final int count = getChildCount();

    // Calculate the number of visible children.
    int visibleCount = 0;
    for (int i = 0; i < count; i++) {
        final View child = getChildAt(i);
        if (child.getVisibility() == GONE) {
            continue;
        }
        ++visibleCount;
    }

    if (visibleCount == 0) {
        return;
    }

    // Horizontal and vertical space between items
    int hSpace = 0;
    int vSpace = 0;

    int cols, rows;

    if(mScreenOrientation == Configuration.ORIENTATION_PORTRAIT) {
        cols = visibleCount;
        rows = 1;
    } else {
        cols = 1;
        rows = visibleCount;
    }

    hSpace = ((width - mMaxChildWidth * cols) / (cols + 1));
    vSpace = ((height - mMaxChildHeight * rows) / (rows + 1));

    // Lay out children based on calculated best-fit number of rows and cols.
    // If we chose a layout that has negative horizontal or vertical space, force it to zero.
    hSpace = Math.max(0, hSpace);
    vSpace = Math.max(0, vSpace);

    // Re-use width/height variables to be child width/height.
    width = (width - hSpace * (cols + 1)) / cols;
    height = (height - vSpace * (rows + 1)) / rows;

    int left, top;
    int col, row;
    int visibleIndex = 0;
    for (int i = 0; i < count; i++) {
        final View child = getChildAt(i);
        if (child.getVisibility() == GONE) {
            continue;
        }

        row = visibleIndex / cols;
        col = visibleIndex % cols;

        left = hSpace * (col + 1) + width * col;
        top = vSpace * (row + 1) + height * row;

        child.layout(left, top, (hSpace == 0 && col == cols - 1) ? r : (left + width), (vSpace == 0 && row == rows - 1) ? b : (top + height));
        ++visibleIndex;
    }
}
}

这是一些测试它的活动代码:

public class TestActivity extends SherlockFragmentActivity {

 @Override
 public void onCreate(Bundle savedInstanceState) {
     // setup ui
     super.onCreate(savedInstanceState);
     setContentView(R.layout.ui_test);

     Nx1Layout layout = (Nx1Layout)findViewById(R.id.layout1);
     layout.setScreenOrientation(getScreenOrientation());
 }

 public int getScreenOrientation()
 {
     Display getOrient = getWindowManager().getDefaultDisplay();
     int orientation = Configuration.ORIENTATION_UNDEFINED;
     if(getOrient.getWidth() == getOrient.getHeight()){
         orientation = Configuration.ORIENTATION_SQUARE;
     } else{ 
         if(getOrient.getWidth() < getOrient.getHeight()){
             orientation = Configuration.ORIENTATION_PORTRAIT;
         }else { 
              orientation = Configuration.ORIENTATION_LANDSCAPE;
         }
     }
     return orientation;
 }}

这是纵向模式的布局文件:

<?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" >
   <com.yourpackagename.Nx1Layout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="70dp"
    android:id="@+id/layout1">

                <ImageView
                    android:id="@+id/image1"
                    android:layout_width="70dp"
                    android:layout_height="70dp"
                    android:contentDescription="some description"
                    android:scaleType="centerInside"
                    android:padding="2dp"
                    android:src="@drawable/test_draw" />

                <ImageView
                    android:id="@+id/image2"
                    android:layout_width="70dp"
                    android:layout_height="70dp"
                    android:contentDescription="some description"
                    android:scaleType="centerInside"
                    android:padding="2dp"
                    android:src="@drawable/test_draw" />

                <ImageView
                    android:id="@+id/image3"
                    android:layout_width="70dp"
                    android:layout_height="70dp"
                    android:contentDescription="some description"
                    android:scaleType="centerInside"
                    android:padding="2dp"
                    android:src="@drawable/test_draw" />

    </com.yourpackagename.Nx1Layout>
</LinearLayout>

这里是横向模式的布局文件:

<?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" >
   <com.yourpackagename.Nx1Layout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="70dp"
    android:layout_height="match_parent"
    android:id="@+id/layout1">

                <ImageView
                    android:id="@+id/image1"
                    android:layout_width="70dp"
                    android:layout_height="70dp"
                    android:contentDescription="some description"
                    android:scaleType="centerInside"
                    android:padding="2dp"
                    android:src="@drawable/test_draw" />

                <ImageView
                    android:id="@+id/image2"
                    android:layout_width="70dp"
                    android:layout_height="70dp"
                    android:contentDescription="some description"
                    android:scaleType="centerInside"
                    android:padding="2dp"
                    android:src="@drawable/test_draw_narrow" />

                <ImageView
                    android:id="@+id/image3"
                    android:layout_width="70dp"
                    android:layout_height="70dp"
                    android:contentDescription="some description"
                    android:scaleType="centerInside"
                    android:padding="2dp"
                    android:src="@drawable/test_draw" />
    </com.yourpackagename.Nx1Layout>
</LinearLayout>

最后但并非最不重要的一些我使用的drawable:

测试抽签

随意评论这个解决方案......

4

0 回答 0