Android百分⽐布局⽀持和垂直TextView
In this tutorial, we’ll discuss and implement Android Percent Layout Support Library. Furthermore, we’ll be creating a Vertical TextView. Finally, we’ll merge the two concepts to code an interesting Login Screen design concept in our application.
在本教程中,我们将讨论并实现Android Percent Layout⽀持库。 此外,我们将创建⼀个Vertical TextView 。 最后,我们将把这两个概念合并在⼀起,以在我们的应⽤程序中编写有趣的登录屏幕设计概念。
Android百分⽐布局⽀持概述 (Android Percent Layout Support Overview)
Android Percent Layout support were introduced with the Android API 23. This library allows us to specify a percentage value for layout_width, layout_height and layout_margin.
Android API 23引⼊了对Android Percent Layout的⽀持。该库使我们可以为layout_width , layout_height和layout_margin指定百分⽐值。
Therefore, a PercentRelativeLayout is a RelativeLayout with an added functionality of assigning weights to the child
view(similarly PercentFrameLayout), a feature which has been always there in LinearLayouts.
sail是什么意思因此, PercentRelativeLayout是⼀个RelativeLayout,具有为⼦视图分配权重的附加功能(类似PercentFrameLayout ),此功能在LinearLayouts中⼀直存在。
Hence, we can put a percentage(out of 100) on child view components prent in Percent Layout in terms of width, height, margins.
图片翻译因此,我们可以对百分⽐布局中存在的⼦视图组件的宽度,⾼度,边距设置⼀个百分⽐(满分为100)。
PercentRelativeLayout and PercentFrameLayout help us in reducing the view complexity since we’re no longer forced to encapsulate our child view with a LinearLayout and u weights for child views.
PercentRelativeLayout和PercentFrameLayout帮助我们降低了视图的复杂度,因为我们不再被迫使⽤LinearLayout封装⼦视图并为⼦视图使⽤权重。
To u Percent Layout support, add the following dependency to adle file.
compile 'com.android.support:percent:25.3.1'
要使⽤百分⽐布局⽀持,请将以下依赖项添加到adle⽂件中。
compile 'com.android.support:percent:25.3.1'
Adding the above dependency allows us to u android.support.percent.PercentRelativeLayout and
android.support.percent.PercentFrameLayout in our application.
添加上述依赖项后,我们就可以在应⽤程序中使
⽤android.support.percent.PercentRelativeLayout和android.support.percent.PercentFrameLayout 。
As a result, we can now replace the and tags in our xml with PercentRelativeLayout and PercentFrameLayout respectively.
结果,我们现在可以分别⽤PercentRelativeLayout和PercentFrameLayout替换xml中的和标记。
Android百分⽐⽀持布局⽰例 (Android Percent Support Layout Example)
Let’s e a sample implementation of layout_widthPercent.
我们来看⼀下layout_widthPercent的⽰例实现。
app:layout_widthPercent: Here we t our views width in percentage.
app:layout_widthPercent :这⾥我们以百分⽐设置视图宽度。
Note: In PercentRelativeLayout, layout_width and layout_height attributes are optional if we have specified layout_widthPercent or layout_heightPercent attribute.
注意 :在PercentRelativeLayout中,如果我们指定了layout_widthPercent或layout_heightPercent属性,
则layout_width和layout_height属性是可选的。
郑州英语培训<?xml version="1.0" encoding="utf-8"?>
<android.support.percent.PercentRelativeLayout xmlns:android="/apk/res/android"
xmlns:app="/apk/res-auto"
xmlns:tools="/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.journaldev.percentlayouts.MainActivity">
<TextView
android:layout_height="wrap_content"
android:text="Hello World!"
android:textSize="20sp"
app:layout_widthPercent="75%" />
</android.support.percent.PercentRelativeLayout>
gap year
Output :
输出 :
We’ve t the layout_widthPercent to 75 in the above implementation. In addition, tting it to 100 would be equivalent to match_parent. We can implement the other layout params that are given below in a similar manner.
在上述实现中,我们已将layout_widthPercent设置为75 。 另外,将其设置为100等同于match_parent。 我们可以类似的⽅式实现下⾯给出的其他布局参数。
1. layout_heightPercent
layout_heightPercent
2. layout_marginPercent
layout_marginPercent
3. layout_marginLeftPercent
layout_marginLeftPercent
4. layout_marginRightPercent
layout_marginRightPercent
5. layout_marginTopPercent
layout_marginTopPercent
6. layout_marginBottomPercent
layout_marginBottomPercent
7. layout_marginStartPercent
layout_marginStartPercent
8. layout_marginEndPercent
layout_marginEndPercent
Android垂直TextView (Android Vertical TextView)
The standard TextView widget that we u displays the text horizontally only. Hence, we’ll be creating a custom TextView that allows us to display the text vertically.
我们使⽤的标准TextView⼩部件仅⽔平显⽰⽂本。 因此,我们将创建⼀个⾃定义TextView,它允许我们垂直显⽰⽂本。
The code for the VerticalTextView.java class is given below:
下⾯给出了VerticalTextView.java类的代码:
package com.journaldev.verticaltextviewandpercentlayout;
t.Context;
aphics.Canvas;
import android.support.v7.widget.AppCompatTextView;
TextPaint;
import android.util.AttributeSet;
import android.view.Gravity;
public class VerticalTextView extends AppCompatTextView {
final boolean topDown;
public VerticalTextView(Context context, AttributeSet attrs) {
super(context, attrs);
final int gravity = getGravity();
if (Gravity.isVertical(gravity) && (gravity & Gravity.VERTICAL_GRAVITY_MASK) == Gravity.BOTTOM) {
tGravity((gravity & Gravity.HORIZONTAL_GRAVITY_MASK) | Gravity.TOP);
topDown = fal;
} el
topDown = true;
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
tMeasuredDimension(getMeasuredHeight(), getMeasuredWidth());
}
@Override
protected void onDraw(Canvas canvas) {
TextPaint textPaint = getPaint();
textPaint.tColor(getCurrentTextColor());
textPaint.drawableState = getDrawableState();
canvas.save();
if (topDown) {
机械类英语
什么是ko} el {
}
getLayout().draw(canvas);
}
}
By default, rotated text is from top to bottom. If we t android:gravity="bottom", then it’s drawn from bottom to top. We save the state of the rotated text (top to bottom/ bottom to top) in the boolean variable topDown.
默认情况下,旋转的⽂本是从上到下。 如果我们设置android:gravity="bottom" ,那么它是从下到上绘制的。 我们将旋转⽂本的状态(从上到下/从下到上)保存在布尔变量topDown 。
In the onMeasure() method we swap the width and height to draw the text rotated.
在onMeasure()⽅法中,我们交换宽度和⾼度以绘制旋转的⽂本。
Finally, in the onDraw() method bad on the topDown boolean flag, we apply a rotation dependent on the gravity tting.
最后,在基于topDown布尔标志的onDraw()⽅法中,我们根据重⼒设置应⽤旋转。
Going further, let’s code an interesting Login UI Concept using Percent Layout support and Vertical TextView.
as3
更进⼀步,让我们使⽤百分⽐布局⽀持和Vertical TextView编写⼀个有趣的Login UI Concept。
Android百分⽐布局和垂直TextView项⽬结构 (Android Percent Layout and Vertical TextView Project Structure)
Take note of the xml files in the anim folder. They’ll be ud to animate between the sign in and register layouts and buttons.
注意anim⽂件夹中的xml⽂件。 它们将⽤于在登录之间创建动画,并注册布局和按钮。
conversationAndroid百分⽐布局和垂直TextView代码 (Android Percent Layout and Vertical TextView Code)
Add the following dependency in adle file.
在adle⽂件中添加以下依赖adle 。
compile 'com.android.support:percent:25.3.1'
The xml layout code for l is given below :
下⾯给出了l的xml布局代码:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="/apk/res/android"
xmlns:app="/apk/res-auto"
android:id="@+id/viewGroup"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="@+id/background"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:scaleType="centerCrop"
android:src="@drawable/background" />
<android.support.percent.PercentRelativeLayout
提高心理素质
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorAccentTrans"
android:orientation="horizontal">
<LinearLayout
android:id="@+id/llSign_in"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"英汉互译翻译器
android:orientation="horizontal"
app:layout_widthPercent="85%">
<com.journaldev.verticaltextviewandpercentlayout.VerticalTextView
android:id="@+id/txtSignIn"
android:layout_width="match_parent"