在Android中使用材质组件的快速指南

For this tutorial, we will be styling an App with Material Theme.The application basically fetches a list of items from [Imgur Api] and displays it via a Recycler. For this guide however, we will just be working with the design of the App using everything material!

在本教程中，我们将使用Material Theme设计样式的应用程序。该应用程序基本上从[ Imgur Api ]获取项目列表，并通过回收站显示。 但是，对于本指南，我们将使用所有材料来进行应用程序的设计！

You can find the starting point for this tutorial on GithHub here.

你可以找到这个教程GithHub起点在这里 。

Styles and Themes

风格和主题

There is no way to distinguish between a style and theme except that a theme is applied to a whole application or an activity while style is mostly applied to a View. However a style can be a part of theme.

除了将主题应用于整个应用程序或活动外，无法区分样式和主题 而样式主要应用于视图。 但是，样式可以是主题的一部分。

制作您的申请材料🔧 (Make Your Application Material 🔧)

Go to res>values> and create a new file named “themes.xml”.

转到res> values>并创建一个名为“ themes.xml”的新文件。

<?xml version="1.0" encoding="utf-8"?>


<resources>
    
    //Top Level Theme
    <style name="Theme.Zimgur.DayNight" parent="Theme.Zimgur" />


    <style name="Theme.Zimgur" parent="Theme.MaterialComponents.DayNight.NoActionBar" />
</resources>

I use Theme.MaterialComponents.DayNight.NoActionBar as I want app to be compatible with DarkMode as well.

我使用Theme.MaterialComponents.DayNight.NoActionBar，因为我希望应用程序也与DarkMode兼容。

Now in AndroidManifest.xml file, set the theme to the application.

现在，在AndroidManifest.xml文件中，将主题设置为应用程序。

<application
 ...
 android:theme="@style/Theme.Zimgur.DayNight" ...>

and remove any other theme from the manifest that might be there for specific activities.

并从清单中删除可能用于特定活动的任何其他主题。

Adding Material Components

添加材料组件

Make sure you don’t set any color value to any of the Views such as TextView, ImageView etc as we want to be able to build a dynamic UI whose colors may change depending upon LIGHT or DARK theme.

确保您没有为任何视图(例如TextView，ImageView等)设置任何颜色值，因为我们希望能够构建一个动态UI，其颜色可能根据LIGHT或DARK主题而变化。

物料卡 (Material Cards)

I’ll wrap the album item_layout in a Material Card, provided by the Material Theme.

我将把专辑item_layou t包裹在Material Theme提供的Material Card中。

I hav