android dashboard布局

最新推荐文章于 2022-06-02 14:06:00 发布

weixin_33696106

最新推荐文章于 2022-06-02 14:06:00 发布

阅读量271

点赞数

文章标签：移动开发 python

原文链接：https://my.oschina.net/luozheng/blog/161874

版权

2019独角兽企业重金招聘Python工程师标准>>>

一直不知道dashboard是个布局，其实有些应用用的挺多的，这种布局中文名叫仪表盘，就是把很多不同的功能，按一个一个不同的图标分列出来，而且这些图标的间距是xiangde感觉就有点像自由适应的gridview

不说了，先上图

先看style.xml

<style name="ActionBarCompat"> 
        <item name="android:layout_width">fill_parent</item> 
        <item name="android:layout_height">50dp</item> 
        <item name="android:orientation">horizontal</item> 
        <item name="android:background">#ff0000</item> 
    </style> 
  
    <style name="DashboardButton"> 
        <item name="android:layout_gravity">center_vertical</item> 
        <item name="android:layout_width">wrap_content</item> 
        <item name="android:layout_height">wrap_content</item> 
        <item name="android:gravity">center_horizontal</item> 
        <item name="android:drawablePadding">2dp</item> 
        <item name="android:textSize">16dp</item> 
        <item name="android:textStyle">bold</item> 
        <item name="android:textColor">#ff29549f</item> 
        <item name="android:background">@null</item> 
    </style>

就是一个头部和每个button的属性，可以忽略

再者就是建立一个DashboardLayout，这个最重要，是大神写的，再次贴出来吧

public class DashboardLayout extends ViewGroup {
	 private static final int UNEVEN_GRID_PENALTY_MULTIPLIER = 10; 
	  
	    private int mMaxChildWidth = 0; 
	    private int mMaxChildHeight = 0; 
	  
	    public DashboardLayout(Context context) { 
	        super(context, null); 
	    } 
	  
	    public DashboardLayout(Context context, AttributeSet attrs) { 
	        super(context, attrs, 0); 
	    } 
	  
	    public DashboardLayout(Context context, AttributeSet attrs, int defStyle) { 
	        super(context, attrs, defStyle); 
	    } 
	  
	    @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(widthMeasureSpec), 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; 
	        } 
	  
	        // Calculate what number of rows and columns will optimize for even horizontal and 
	        // vertical whitespace between items. Start with a 1 x N grid, then try 2 x N, and so on. 
	        int bestSpaceDifference = Integer.MAX_VALUE; 
	        int spaceDifference; 
	  
	        // Horizontal and vertical space between items 
	        int hSpace = 0; 
	        int vSpace = 0; 
	  
	        int cols = 1; 
	        int rows; 
	  
	        while (true) { 
	            rows = (visibleCount - 1) / cols + 1; 
	  
	            hSpace = ((width - mMaxChildWidth * cols) / (cols + 1)); 
	            vSpace = ((height - mMaxChildHeight * rows) / (rows + 1)); 
	  
	            spaceDifference = Math.abs(vSpace - hSpace); 
	            if (rows * cols != visibleCount) { 
	                spaceDifference *= UNEVEN_GRID_PENALTY_MULTIPLIER; 
	            } 
	  
	            if (spaceDifference < bestSpaceDifference) { 
	                // Found a better whitespace squareness/ratio 
	                bestSpaceDifference = spaceDifference; 
	  
	                // If we found a better whitespace squareness and there's only 1 row, this is 
	                // the best we can do. 
	                if (rows == 1) { 
	                    break; 
	                } 
	            } else { 
	                // This is a worse whitespace ratio, use the previous value of cols and exit. 
	                --cols; 
	                rows = (visibleCount - 1) / cols + 1; 
	                hSpace = ((width - mMaxChildWidth * cols) / (cols + 1)); 
	                vSpace = ((height - mMaxChildHeight * rows) / (rows + 1)); 
	                break; 
	            } 
	  
	            ++cols; 
	        } 
	  
	        // 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; 
	        } 
	    } 

}

接下来就是main.xml了

<RelativeLayout 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=".MainActivity" >

   <LinearLayout style="@style/ActionBarCompat" > 
	   <ImageView
	        android:layout_width="wrap_content"
	        android:layout_height="fill_parent"
	        android:clickable="false"
	        android:paddingLeft="15dip"
	        android:scaleType="center"
	        android:src="@drawable/ic_launcher" /> 
    </LinearLayout>
    <com.example.dashboard.DashboardLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:background="#f8f9fe" > 
    <!--  News Feed Button -->
    <Button
        android:id="@+id/btn_news_feed"
        style="@style/DashboardButton"
        android:drawableTop="@drawable/ic_launcher"
        android:text="News Feed" /> 
  
    <!--  Friends Button -->
    <Button
        android:id="@+id/btn_friends"
        style="@style/DashboardButton"
        android:drawableTop="@drawable/ic_launcher"
        android:text="Friends" /> 
  
    <!--  Messages Button -->
    <Button
        android:id="@+id/btn_messages"
        style="@style/DashboardButton"
        android:drawableTop="@drawable/ic_launcher"
        android:text="Messages" /> 
  
    <!--  Places Button -->
    <Button
        android:id="@+id/btn_places"
        style="@style/DashboardButton"
        android:drawableTop="@drawable/ic_launcher"
        android:text="Places" /> 
  
    <!--  Events Button -->
    <Button
        android:id="@+id/btn_events"
        style="@style/DashboardButton"
        android:drawableTop="@drawable/ic_launcher"
        android:text="Events" /> 
  
    <!--  Photos Button -->
    <Button
        android:id="@+id/btn_photos"
        style="@style/DashboardButton"
        android:drawableTop="@drawable/ic_launcher"
        android:text="Photos" /> 
  
</com.example.dashboard.DashboardLayout>
</RelativeLayout>

一个头部文件，然后就是引用的DashboardLayout，在里面有6个button

最后在入口acitivity加载出来，就是开始图片的效果了，但是不知道其他分辨率如何，但手里木有平板，只能在android graphical layout里面抓图，图有点小，将就看吧