Android 四分一圆的shape与运用

2017-11-09  本文已影响118人  自然之秋

Android中用Shape实现圆角和局部圆角等

TIM截图20171109091949.png

如图,UI 妹妹想要此种效果,我与美美约定,我画不出来你就来 Help Me。她说你最棒你行的。我害羞的笑一笑。
其实确实简单,不就一个框加一个扇形圆么?
直接代码记录,需要的 Copy 。


TIM截图20171109093502.png TIM截图20171109093615.png TIM截图20171109093721.png TIM截图20171109093907.png

OK了,截图能说明一切,更清晰!

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/dj_test_site_item_main"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/white"
android:orientation="horizontal"
android:paddingBottom="5dp"
android:paddingTop="5dp" >

<RelativeLayout
    android:id="@+id/dj_selected_shape"
    android:layout_width="match_parent"
    android:layout_height="40dp"
    android:layout_marginLeft="10dp"
    android:layout_marginRight="10dp"
    android:background="@drawable/a_shanxing_yuan_selected_kuang"  >

    <ImageView
        android:layout_width="10dp"
        android:layout_height="10dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/a_shanxing_yuan_selected_shape" />
</RelativeLayout>
<RelativeLayout
     android:id="@+id/dj_unselected_shape"
    android:layout_width="match_parent"
    android:layout_height="40dp"
    android:layout_marginLeft="10dp"
    android:layout_marginRight="10dp"
    android:background="@drawable/a_shanxing_yuan_unselected_kuang"  >

    <ImageView
        android:layout_width="10dp"
        android:layout_height="10dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/a_shanxing_yuan_unselected_shape" />
</RelativeLayout>

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:paddingBottom="5dp"
    android:paddingTop="5dp" >

    <TextView
        android:id="@+id/dj_test_site_item_rank"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_gravity="center_vertical"
        android:layout_marginLeft="10dp"
        android:layout_weight="1"
        android:gravity="center"
        android:paddingBottom="5dp"
        android:paddingLeft="5dp"
        android:paddingRight="5dp"
        android:paddingTop="5dp"
        android:textColor="@color/blue1"
        android:textSize="@dimen/text_size_12" />

    <TextView
        android:id="@+id/dj_test_site_item_time"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_gravity="center_vertical"
        android:layout_marginLeft="5dp"
        android:layout_weight="1"
        android:ellipsize="end"
        android:paddingBottom="5dp"
        android:paddingTop="5dp"
        android:singleLine="true"
        android:text="  "
        android:textColor="@color/word3"
        android:textSize="@dimen/text_size_13" />

    <TextView
        android:id="@+id/dj_test_site_item_title"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_gravity="center_vertical"
        android:layout_marginLeft="5dp"
        android:layout_marginRight="10dp"
        android:layout_weight="4"
        android:ellipsize="end"
        android:maxLines="1"
        android:paddingBottom="5dp"
        android:paddingTop="5dp"
        android:text="  "
        android:textColor="@color/word3"
        android:textSize="@dimen/text_size_13" />
</LinearLayout>

</FrameLayout>

a_shanxing_yuan_selected_kuang.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<solid android:color="@color/white" />
<stroke
android:width="1dp"
android:color="#ff7521" />
<corners
android:bottomLeftRadius="0dip"
android:bottomRightRadius="0dip"
android:topLeftRadius="0dip"
android:topRightRadius="0dip" />
</shape>

a_shanxing_yuan_selected_shape.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<solid android:color="#ff7521" />
<size android:height="10dp" />
<corners
android:bottomLeftRadius="10dp"
android:bottomRightRadius="0dp"
android:topLeftRadius="0dp"
android:topRightRadius="0dp" />
</shape>

-——————corners的值 与 size_size android:height值注意一下,就OK了,
然后就是嵌套啦,扇形与外框嵌套,再嵌套到条目里面。

由于这个项目维护了4-5年很老,所以用listview实现的很Low,关键是记录 shape。

补充一下选中与未选中 :

final List<SiteListBean> site_list = allListDatas.site_list;
if (site_list != null) {
Log.e(TAG, " DJDetailTestSiteAdapter(this, site_list) ");
final DJDetailTestSiteAdapter djDetailTestSiteAdapter = new DJDetailTestSiteAdapter(this, site_list);
mTestSiteListView.setAdapter(djDetailTestSiteAdapter);
for (int i = 0; i < site_list.size(); i++) {
if (i == 0) {
site_list.get(i).isFocus = true;
} else {
site_list.get(i).isFocus = false;
}
}
mTestSiteListView.setOnItemClickListener(new OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> view, View arg1, int position, long arg3) {
site_id = site_list.get(position).site_id;
Toast.makeText(mContext, position + " = position---报名按钮点击---" + site_id, Toast.LENGTH_SHORT).show();
DetailTestSiteViewHolder viewHolder = (DetailTestSiteViewHolder) view.getTag();
Log.e(TAG, "position = " + position);
for (int i = 0; i < site_list.size(); i++) {
site_list.get(i).isFocus = false;
if (i == position) {
Log.e(TAG, "position = " + position +" i = "+i);
site_list.get(position).isFocus = true;
}
}
djDetailTestSiteAdapter.notifyDataSetChanged();
}
});
}

public class DJDetailTestSiteAdapter extends BaseAdapter {

private Activity mContext;
private List<SiteListBean> mListDatas;

public DJDetailTestSiteAdapter(Activity mActivity, List<SiteListBean> mListDatas) {
    this.mContext = mActivity;
    this.mListDatas = mListDatas;
}

@Override
public int getCount() {
    return mListDatas.size();
}

@Override
public Object getItem(int position) {
    return mListDatas.get(position);
}

@Override
public long getItemId(int position) {
    return position;
}

@Override
public View getView(final int position, View view, ViewGroup parent) {
    DetailTestSiteViewHolder viewHolder;
    if (view == null) {
        view = View.inflate(mContext, R.layout.dj_arrange_list_item, null);
        viewHolder = new DetailTestSiteViewHolder();
        viewHolder.tvRank = (TextView) view.findViewById(R.id.dj_test_site_item_rank);
        viewHolder.tvTime = (TextView) view.findViewById(R.id.dj_test_site_item_time);
        viewHolder.tvTitle = (TextView) view.findViewById(R.id.dj_test_site_item_title);
        viewHolder.selecteBg = (RelativeLayout) view.findViewById(R.id.dj_selected_shape);
        viewHolder.unselecteBg = (RelativeLayout) view.findViewById(R.id.dj_unselected_shape);
        viewHolder.itemMain = (FrameLayout) view.findViewById(R.id.dj_test_site_item_main);
        view.setTag(viewHolder);

    } else {
        viewHolder = (DetailTestSiteViewHolder) view.getTag();
    }

    setBackGroup(viewHolder, position);

    viewHolder.tvRank.setText(mListDatas.get(position).dengji_ids + "");
    viewHolder.tvTime.setText(mListDatas.get(position).site_exam_time + "");
    viewHolder.tvTitle.setText(mListDatas.get(position).site_name + "");

    boolean isFocus = (boolean) mListDatas.get(position).isFocus;
    if (isFocus) {
        viewHolder.selecteBg.setVisibility(View.VISIBLE);
        viewHolder.unselecteBg.setVisibility(View.GONE);
    } else {
        viewHolder.selecteBg.setVisibility(View.GONE);
        viewHolder.unselecteBg.setVisibility(View.VISIBLE);
    }
    
    return view;
}

private void setBackGroup(DetailTestSiteViewHolder viewHolder, int position) {
    if (position == 0) {
        viewHolder.selecteBg.setVisibility(View.VISIBLE);
        viewHolder.unselecteBg.setVisibility(View.GONE);
    } else {
        viewHolder.selecteBg.setVisibility(View.GONE);
        viewHolder.unselecteBg.setVisibility(View.VISIBLE);
    }
}

public class DetailTestSiteViewHolder {
    FrameLayout itemMain;
    RelativeLayout selecteBg, unselecteBg;
    TextView tvRank, tvTime, tvTitle;
}

}

public static class SiteListBean {

            public String site_id;
            public String site_name;
            public String site_exam_time;
            public String dengji_ids;
            public boolean isFocus;
        }

关于自定义drawable圆角,代码中动态修改边线及填充色
在代码中根据需求动态的修改填充色及背景色
//tvBind是我的textview控件,将边线的颜色变成红色,边线宽度2dp
GradientDrawable drawable = (GradientDrawable) tvBind.getBackground();
drawable.setStroke(2, getResources().getColor(R.color.mall_red_text));
//改变drawable的背景填充色
drawable.setColor(getResources().getColor(R.color.mall_red_text));

TIM截图20171111134024.png TIM截图20171111134043.png TIM截图20171111134059.png TIM截图20171111134119.png
上一篇下一篇

猜你喜欢

热点阅读