与不同的子视图对角线分割布局自定义视图 [英] Custom view that splits layout diagonally with different child views
问题描述
如何分割的LinearLayout
或 RelativeLayout的
斜分成两个大小不等,每个具有不同子视图。例如 ViewPager
在上半部分和底部不同的的LinearLayout
。
How can i split LinearLayout
or RelativeLayout
diagonally into two varying sizes and each having different child view. Example ViewPager
in upper half section and a different LinearLayout
in bottom section.
是这样的:
我怎样才能做到这一点?请帮助
How can i achieve this? Please help
推荐答案
最简单的方法是,只是做一个背景图片与倾斜切。如果你想有一个动态的布局,要真正切断窗口小部件,使用Canvas.saveLayer /恢复。像这样的:
The easiest approach is to just make a background image with that skewed cut. If you wish to have a dynamic layout and you want to really cut widgets, use Canvas.saveLayer/restore. Like this:
private Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
private Xfermode pdMode = new PorterDuffXfermode(PorterDuff.Mode.CLEAR);
private Path path = new Path();
protected void dispatchDraw(Canvas canvas) {
int saveCount = canvas.saveLayer(0, 0, getWidth(), getHeight(), null, Canvas.ALL_SAVE_FLAG);
super.dispatchDraw(canvas);
paint.setXfermode(pdMode);
path.reset();
path.moveTo(0, getHeight());
path.lineTo(getWidth(), getHeight());
path.lineTo(getWidth(), getHeight() - TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 50, getResources().getDisplayMetrics()));
path.close();
canvas.drawPath(path, paint);
canvas.restoreToCount(saveCount);
paint.setXfermode(null);
}
要点: https://gist.github.com/ZieIony/8480b2d335c1aeb51167
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
tools:showIn="@layout/activity_main">
<com.example.marcin.splitlayout.CutLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:scaleType="centerCrop"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="@drawable/mazda" />
</com.example.marcin.splitlayout.CutLayout>
<TextView
android:layout_margin="16dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Mazda 3" />
</LinearLayout>
顺便说一句。这件事是最近非常流行:)
Btw. This thing is very popular recently :)
这篇关于与不同的子视图对角线分割布局自定义视图的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!