Google Sign In Button在博览会上的品牌推广风格

Question

我遵循了这个expo-google-app-auth，并在react原生应用中使用了身份验证。

const { type, accessToken, user } = await Google.logInAsync(config);

这样，我将获取accessToken并将其传递给具有firebase集成的node.js

var credential = firebase.auth.GoogleAuthProvider.credential(id_token);

这里一切正常，现在我的问题是我想要使用GoogleSignIn品牌按钮。对我来说，仅仅是普通的按钮就足够了，不需要任何google库来添加按钮。有没有什么风格可以单独将它集成到普通按钮中？

Answer 1

据我所知，expo不提供像react-native-cli那样的谷歌品牌登录按钮。但是您可以使用react-native-elements库。有一个内置的组件，名称为social图标，您只需将google作为type传递即可。更多的解释可以在here找到。

谢谢

Answer 2

正如另一个答案提到的，expo没有内置的谷歌品牌登录按钮。

我的策略是使用一个图标按钮，它可以在@expo/vector-icons包中找到。FontAwesome5有一个谷歌图标，这为你提供了一种简单且可定制的方式来创建与品牌相匹配的按钮。

假设您已经导入并使用了文本等基本的原生react函数，您的代码可能如下所示：

import { FontAwesome5 } from '@expo/vector-icons';

// your code... 

<FontAwesome5.Button style={styles.googleButton} name="google" onPress={() => this.googleLogIn()}
        //any other customization you want, like borderRadius, color, or size
>
  <Text style={styles.googleText}>Log In With Google</Text>
</FontAwesome5.Button>

以下是文档中的相关部分：https://docs.expo.io/guides/icons/#button-component

顺便说一句，使用FontAwesome、FontAwesome5、Ionicons或@expo/vector-icons中包含的任何其他图标库都无关紧要。它们都有这个按钮组件。你可以在这里看到图标列表：https://icons.expo.fyi/