Custom view that splits layout diagonally with different child views(自定义视图,用不同的子视图对角分割布局)
问题描述
我怎样才能将 LinearLayout
或 RelativeLayout
对角分割成两个不同的大小,每个都有不同的子视图.上半部分的示例 ViewPager
和下半部分的不同 LinearLayout
.
类似这样的:
我怎样才能做到这一点?请帮忙
最简单的方法是制作带有倾斜剪切的背景图像.如果您希望拥有动态布局并且想要真正剪切小部件,请使用 Canvas.saveLayer/restore.像这样:
private Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);私有 Xfermode pdMode = new PorterDuffXfermode(PorterDuff.Mode.CLEAR);私有路径 path = new Path();受保护的无效dispatchDraw(帆布画布){int saveCount = canvas.saveLayer(0, 0, getWidth(), getHeight(), null, Canvas.ALL_SAVE_FLAG);super.dispatchDraw(画布);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(路径,油漆);canvas.restoreToCount(saveCount);paint.setXfermode(null);}
要点:
顺便说一句.这东西最近很流行:)
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.
something like this :
How can i achieve this? Please help
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);
}
Gist: 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 :)
这篇关于自定义视图,用不同的子视图对角分割布局的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:自定义视图,用不同的子视图对角分割布局
基础教程推荐
- 如何在 UIImageView 中异步加载图像? 2022-01-01
- 当从同一个组件调用时,两个 IBAction 触发的顺序是什么? 2022-01-01
- android 应用程序已发布,但在 google play 中找不到 2022-01-01
- Kivy Buildozer 无法构建 apk,命令失败:./distribute.sh -m “kivy"d 2022-01-01
- 如何在 iPhone 上显示来自 API 的 HTML 文本? 2022-01-01
- UIWebView 委托方法 shouldStartLoadWithRequest:在 WKWebView 中等效? 2022-01-01
- 在 gmail 中为 ios 应用程序检索朋友的朋友 2022-01-01
- 如何在没有IB的情况下将2个按钮添加到右侧的UINavigationbar? 2022-01-01
- 如何让对象对 Cocos2D 中的触摸做出反应? 2022-01-01
- Android:对话框关闭而不调用关闭 2022-01-01