Question

我已经在Outlook for Android应用中看到了这种新的Snackbar样式，现在在材料文档中寻找了它：

https://material.io/design/components/snackbars.html

有人知道如何创建那些“偏移小吃店”吗？

Answer 1

如何创建“偏移零食”？

您可以获取SnackBar的var rand1 = "" var rand2 = "" var rand3 = "" var textField1 = [Int]() var code = [String]() override func viewDidLoad() { super.viewDidLoad() var shoppingList: [String] = ["one", "two", "three", "four", "five", "six", "seven", "eight", "nine", "zero"] rand1 = shoppingList[Int(arc4random()%(UInt32(shoppingList.count)))] rand2 = shoppingList[Int(arc4random()%(UInt32(shoppingList.count)))] rand3 = shoppingList[Int(arc4random()%(UInt32(shoppingList.count)))] //ensures rand1 and rand2 are not the same while(rand2 == rand1){ rand2 = shoppingList[Int(arc4random()%(UInt32(shoppingList.count)))] } //ensures rand3 is different from rand1 and rand2 while(rand3 == rand1 || rand3 == rand2){ rand3 = shoppingList[Int(arc4random()%(UInt32(shoppingList.count)))] } code = ["\(rand1), \(rand2), \(rand3)"] label?.text = "\(rand1), \(rand2), \(rand3)" } func wordToNumber(with word: String) -> Int? { switch word { case "zero": return 0 case "one": return 1 case "two": return 2 case "three": return 3 case "four": return 4 case "five": return 5 case "six": return 6 case "seven": return 7 case "eight": return 8 case "nine": return 9 default: return nil } } func checkIfCodeIsCorrect() -> Bool { let codeAsNumbers = code.map { return wordToNumber(with: $0) } print(codeAsNumbers) return codeAsNumbers == textField1 } @IBAction func control(_ sender: UIButton) { let number = sender.currentTitle textField.text = textField.text! + number! textField1.append(Int(number!)!) print(textField1) if (textField.text?.count)! > 2 { print(checkIfCodeIsCorrect()) } }并为其添加底部和边边距

尝试下面的代码

LayoutParams

Answer 2

您需要使用新的Material主题。在您的build.gradle中导入
implementation 'com.google.android.material:material:1.2.0-alpha06'

将所有Snackbar导入更改为：

import com.google.android.material.snackbar.Snackbar

然后在您的style.xml文件中，父主题必须是以下重要主题之一：

Theme.MaterialComponents.Light.DarkActionBar

Theme.MaterialComponents.DayNight.NoActionBar

Answer 3

构建像材料一样的圆形SnackBar只需要做三件事：

获取SnackBar的LayoutParams并设置边距
创建圆角形状
将圆角形状设置为SnackBar的背景

这是完整的代码：

Snackbar.make(
            findViewById(R.id.coordinator_layout),
            "Your text here",
            Snackbar.LENGTH_SHORT
        ).apply {
            view.layoutParams = (view.layoutParams as CoordinatorLayout.LayoutParams).apply {
                setMargins(
                    12,
                    12,
                    12,
                    12
                )
            }
            view.background = resources.getDrawable(R.drawable.round_corner, null)
        }.show()

这是drawable / round_corner中圆角可绘制的代码：

  <shape android:shape="rectangle"
    xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="#323232"/>
    <corners android:radius="4dp"/>
</shape>

Answer 4

我从https://material.io/develop/android/components/snackbars/

添加了这些样式

<style name="Theme.App" parent="Theme.MaterialComponents.*">
    ...
    <item name="snackbarStyle">@style/Widget.App.Snackbar</item>
    <item name="snackbarButtonStyle">@style/Widget.App.SnackbarButton</item>
</style>

<style name="Widget.App.Snackbar" parent="Widget.MaterialComponents.Snackbar">
    <item name="materialThemeOverlay">@style/ThemeOverlay.App.Snackbar</item>
    <item name="actionTextColorAlpha">1</item>
  </style>

<style name="Widget.App.SnackbarButton" parent="Widget.MaterialComponents.Button.TextButton.Snackbar">
    <item name="android:textColor">@color/shrine_pink_100</item>
</style>

<style name="ThemeOverlay.App.Snackbar" parent="">
    <item name="colorPrimary">@color/shrine_pink_100</item>
    <item name="colorOnSurface">@color/shrine_pink_900</item>
</style>

它有效！以编程方式修改代码/布局/背景无法正常工作

Answer 5

您可以只在材料组件库中使用默认的Snackbar：

如果要更改Snackbar的边距，可以在应用程序主题中添加snackbarStyle属性：

<style name="AppTheme" parent="Theme.MaterialComponents.DayNight">
    <item name="snackbarStyle">@style/MySnackbar</item>
</style>

具有：

<style name="MySnackbar" parent="Widget.MaterialComponents.Snackbar">
    <item name="android:layout_margin">32dp</item>
</style>

如何像材料文档中一样创建Snackbar？

5 个答案: