在android中动态创建UI

时间:2013-09-05 13:50:51

标签: android android-layout android-ui

我想为图像中显示的平板电脑制作UI。此UI将根据项目数重复。并且每个块(即小块或大块)的位置可以动态改变。请给我一些建议我应该使用的视图,布局。 任何建议将不胜感激......提前感谢。

enter image description here

6 个答案:

答案 0 :(得分:2)

如果您的目标是API v14或更高版本,则可以使用GridLayout:http://developer.android.com/reference/android/widget/GridLayout.html

答案 1 :(得分:1)

使用LinearLayout添加每个类别,并为每个类别使用RelativeLayout是一个不错的选择。您应该根据其包含的产品数量自定义相对布局的onlayout方法。

你也可以使用片段,listview。

图像更改后编辑:您可以扩展relativelayout并覆盖onLayout方法。这将比嵌套布局表现更好,我想不出任何其他你可以用更少的努力逃脱的东西。

EDIT for elaboration:

这是我使用的示例类。基本上在onlayout方法中,您可以通过调用每个视图的布局方法并传递矩形的参数来做出每个决定并告诉所有子视图将它们放置在矩形中。看看我如何使用子视图的布局方法来指示矩形。

public class KnockPile extends  HandPile
{

private static final String TAG = "KnockPile";

static final int EXPECTED_CARDS = 3;

int mColoring; // this is the coloring group this pile is associated with.
// every card added to this pile should be set with this color.


public KnockPile(Context context, GameActivity ref , int ingroup)
{
    super(context );
    mColoring = ingroup;
    mActivityReference = ref;

    setWillNotDraw(false);
    setClickable(true);
    setOnDragListener(this);
    mCardBorders = new ArrayList<Integer>(); 

    final LayoutTransition transition  = new LayoutTransition();
    setLayoutTransition(transition );
    //transition .enableTransitionType(LayoutTransition.CHANGING);
    //transition .disableTransitionType(LayoutTransition.CHANGE_APPEARING);

}



/**
 * this overrides the card ordering of handpile. This method lays the cards in a linear fashion.
 * Possibly overlapping fashion. This is not dependent to orientation of screen.
 *
 * @see com.kavhe.kondi.gin.layouts.HandPile#onLayout(boolean, int, int, int, int)
 */
@Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {   


    int availablewidth = getMeasuredWidth() ;//this is the maximum availlable  
    int distance = availablewidth /Math.max(getChildCount(), 1) ; // the horizontal distance between two cards
    Log.v(TAG,"available width onlayout is :" + availablewidth +"and distance is  " + distance);
    int cardheight = getHeight();
    int cardwidth  = cardheight*3/4; 
    if(distance > cardwidth) distance = cardwidth;
    mCardBorders.clear();
    for(int i = 0 ; i < mCards.size() ; i++)
    {     
        //save this border into a global variable so that it can be used when one of the cards dragged
        //by user to show that user can insert to that location
        mCardBorders.add( i*distance);
        mCards.get(i).layout(  i*distance ,  0 , cardwidth+ i*distance ,   cardheight); 
    }

}
}

这是来自documentation

protected void onLayout(boolean changed,int left,int top,int right,int bottom)

当此视图应为其每个子项指定大小和位置时,从布局调用。带子项的派生类应该覆盖此方法并在每个子项上调用布局。

参数

已更改这是此视图的新尺寸或位置

左侧位置,相对于父级

顶部位置,相对于父母

右侧相对于父母的右侧位置

底部相对于父母的底部位置

答案 2 :(得分:1)

也可以通过表格布局及其行范围属性

答案 3 :(得分:0)

你所画的“产品”总是能很好地适应线条吗?如果那时,您可以使用彼此嵌套的LinearLayouts(垂直和水平)。

答案 4 :(得分:0)

要为平板电脑设计此类用户界面,您应该使用Fragments并在片段内添加/删除相应的布局。如果您正在进行相对布局,则需要正确使用RelativeLayout.LayoutParams。

如果您正在寻找使用片段的最佳示例,请尝试Google IO app来源。它使用各种动态UI功能。

希望它有所帮助!

答案 5 :(得分:0)

在StaggeredGridView的帮助下,我解决了我的要求。 感谢所有人的帮助和支持。