• 赚钱入口【需求资源】限时招募流量主、渠道主,站长合作;【合作模式】CPS长期分成,一次推广永久有收益。主动打款,不扣量;

Android Shape Drawables教程

Android rin, seun 1年前 (2020-06-20) 279次浏览 0个评论

您是否曾经想减小Android应用程序的大小或使其看起来更有趣?如果是,那么您应该尝试ShapeDrawables。

首先,我们将介绍ShapeDrawables的优缺点。然后,我们将创建一些可在您的应用程序中使用的Drawables,最后,为总决赛,我们将尝试复制渐变,如Spotify应用程序/网站中所示。

为什么要使用ShapeDrawables?

当您想在应用程序中使用PNGJPEG图像时,必须为不同的屏幕密度提供同一图像的多个副本。当然,这会使您的应用程序具有相同图像的副本。是的,有时这是我们必须选择的路径,因为我们不能在每种情况下都使用Drawables,但是如果可以使用Drawables,则可以大大减小应用程序的大小。ShapeDrawables是一系列命令,它们告诉如何在屏幕上绘制内容。这就是为什么可以在不损失任何质量的情况下根据需要调整大小和拉伸它们的原因。即使应用正在运行,我们也可以重新着色并对其进行操作,并使用相同的ShapeDrawable在我们的应用中多次。由于ShapeDrawables是Drawable抽象类的子类,因此我们可以在需要Drawable的方法中使用它们。单击以获取ShapeDrawable的文档。

有什么缺点吗?

当然,就像我之前提到的,我们不能在每种情况下都使用它们。我之前已经说过ShapeDrawable类是Drawable抽象类的子类。还有其他子类,每个子类都有自己的用例。您可以单击此处检查其他Drawable类型,并确定哪种类型适合您的情况。另一个问题是,它们的绘制时间比位图要长一些,因为在后台进行了大量的解析和绘制。但是,如果您的Drawable很简单,我认为这不是一个大问题。

让我们开始编码

首先,让我们看一个简单的示例,然后我们将重新创建渐变,就像在Spotify应用程序/网站中可以看到的那样。

用XML创建一个简单的渐变ShapeDrawable

首先创建一个新的可绘制资源文件。

Android Shape Drawables教程

shape_drawable_example_1.xml

定义形状时可以使用的一些有用的属性:

1.)形状类型

您可以使用shape标签中的android:shape XML属性指定形状的类型。如果不指定形状,则选择默认的矩形类型。其他可用的形状是椭圆形,直线形和环形。这是一个例子:

android:shape =“ oval”

2.)圆角

由于我们的形状是矩形,因此我们可以圆角化矩形的角。您可以在Corners标签内执行此操作。您可以使用android:radius指定所有角的半径。这是一个例子:

android:radius =” 21dp” 
android:bottomLeftRadius =” 10dp”

3.)渐变色或纯色

如果要使用纯色,则应使用纯色标签,然后在该标签内部可以使用android:color指定颜色。这是一个例子:

android:color = @ color / your_color_name
android:startColor = @ color / your_color_name 
android:centerColor = @ color / your_color_name 
android:endColor = @ color / your_color_name
android:type =“ radial”

4.)指定大小

如果需要,可以指定形状的大小。请记住,您可以稍后更改大小,例如在ImageView中使用ShapeDrawable时。您可以在size标签内更改尺寸。使用ndroid:layout_heightandroid:layout_width来实现。您可能知道以下两个:

android:layout_height =“ 40dp” 
android:layout_width =“ 10dp”

5.)描边(围绕形状的轮廓)

有时,您想要在形状周围绘制轮廓,并且可以使用笔触标签来做到这一点。您可以使用android:widthandroid:color指定轮廓的宽度颜色。这是一个例子:

android:width =“ 2dp” 
android:color = @ color / your_beautiful_color
android:dashGap =“ 1dp” 
android:dashWidth =“ 4dp”

让我们在视图中使用形状

对形状满意后,例如可以在View中使用它。这就是使用XML 在ImageView中使用圆形的方式。

<ImageView xmlns:android =“ http://schemas.android.com/apk/res/android” 
android:id =“ @ + id / my_image_view” 
android:layout_width =“ wrap_content” 
android:layout_height =“ wrap_content” 
android: background =” @ drawable / my_custom_circle” 
android:text =” @ string / hello_world” />
android:src =” @ drawable / my_custom_circle”
ImageView myImageView =(ImageView)findViewById(R.id.my_image_view);imageView.setImageResource(R.drawable.my_custom_circle);

使用Java修改形状

现在您知道了如何使用XML定义形状以及如何在视图中使用它们但是也必须有一种使用Java定义和修改它们的方法,对吗?当然可以,但我建议您尽可能使用XML定义形状,因为这样可以更直观地查看和检查进度。如果使用XML定义形状,则可以使用Java中的getDrawable方法来获取对形状的引用。此方法将返回Drawable。请注意,即使您的应用正在运行,您也可以操纵形状。

Drawable drawable = getDrawable(R.drawable.button_shape);
GradientDrawable gradientDrawable =(GradientDrawable)可绘制;
gradientDrawable.setColor(ContextCompat.getColor(this,R.color.colorPrimary)); 
gradientDrawable.setShape(GradientDrawable.OVAL); 
gradientDrawable.setStroke(12,Color.CYAN);

使用Java定义形状

这是仅使用Java即可创建和使用形状的方式。链接以获取有关该信息的更多信息

RoundRectShape roundRectShape =新RoundRectShape(新浮[] { 
10,10,10,10,
10,10,10,10},NULL,NULL);ShapeDrawable shapeDrawable = new ShapeDrawable(roundRectShape); 
shapeDrawable.getPaint()。setColor(Color.parseColor(“#FFFFFF”));ImageView myImageView = findViewById(R.id.my_image_view); 
myImageView.setBackground(shapeDrawable); 
//或您可以使用myImageView.setImageDrawable(shapeDrawable);

现在是时候进行最后一步了。让我们使用我们的新技能来重新创建此Spotify的渐变。

这是我们将重新创建的布局的原始图像:

Android Shape Drawables教程

原始图片

这是渐变背景的代码:

这是获取访问按钮周围的圆角矩形的代码:

现在,让我们在布局中使用这些形状。这是布局的最终​​代码:

不幸的是,我们的字体和边距并不完美,但我认为我们做到了!看起来很好。

Android Shape Drawables教程

我们的娱乐
喜欢 (0)

您必须 登录 才能发表评论!