There is documentation about this, but it is for macOs only. https://github.com/react-native-community/react-native-linear-gradient.

虽然有相关文档，但它仅适用于MacOS。Https://github.com/react-native-community/react-native-linear-gradient.

I linked the library by running npm install react-native link react-native-linear-gradient.

我通过运行NPM INSTALL REACT-Native LINK REACT-Native-LINEAR-GRADIATE来链接库。

I don't understand this i dont have a ios folder, i installed pod but my ios folder remained empty:

我不明白我没有iOS文件夹，我安装了Pod，但iOS文件夹仍然是空的：

iOS
For React Native >= 0.60.0 run the following command in the ios/ folder and skip the rest of the section.

对于Reaction Native>=0.60.0的IOS，在iOS/文件夹中运行以下命令并跳过本部分的其余部分。

pod install
CocoaPods
Add the following line to your Podfile:

Pod Install CocoaPods将以下行添加到Podfile中：

pod 'BVLinearGradient', :path => '../node_modules/react-native-linear-gradient'
or:

Pod‘BVLinearGRadient’，：Path=>‘../node_modules/react-native-linear-gradient’或：

This below is only for macOs ?

下面的内容只适用于MacOS吗？

Manually
Open your project in Xcode, right click on Libraries and click Add Files to "Your Project Name" Look under node_modules/react-native-linear-gradient/ios and add BVLinearGradient.xcodeproj. (Screenshot 1) (Screenshot 2).
Add libBVLinearGradient.a to Build Phases -> Link Binary With Libraries (Screenshot 1) (Screenshot 2).
Click on BVLinearGradient.xcodeproj in Libraries and go the Build Settings tab. Double click the text to the right of Header Search Paths and verify that it has $(SRCROOT)/../react-native/React - if it isn't, then add it. This is so Xcode is able to find the headers that the BVLinearGradient source files are referring to by pointing to the header files installed within the react-native node_modules directory. (Screenshot).

在Xcode中手动打开您的项目，右键单击库，然后单击Add Files to“Your Project Name”(将文件添加到“Your Project Name”中)，然后在NODE_MODULES/REACTION-Native-LINEAR-GRADIAND/iOS下查找并添加BVLinearGRadient.xcodeproj。(截图1)(截图2)。添加libBVLinearGRadient.a以构建阶段->将二进制文件与库链接(截图1)(截图2)。单击库中的BVLinearGRadient.xcodeproj，然后转到构建设置选项卡。双击头搜索路径右侧的文本并验证它是否包含$(SRCROOT)/../REACT-Native/REACTION-如果不是，则添加它。这是为了使Xcode能够通过指向安装在REACT-NODE_MODULES目录中的头文件来查找BVLinearGRadient源文件所引用的头文件。(截图)。

How to do it in Windows and i don't have an ios map inside node_modules/react-native-linear-gradient/?

如何在Windows中执行此操作，而我的NODE_MODULES/REACTION-NIVE-LINEAR-GRADER/内没有iOS映射？

how can i make it work?

我怎么才能让它起作用呢？

Thanks for your time

谢谢你的时间

优秀答案推荐

use this one if you are using expo

如果您使用的是EXPO，请使用此选项

1 . paste this in terminal window :

1.在终端窗口中粘贴以下内容：

expo install expo-linear-gradient

2.add the import statement to the file :

2.将导入语句添加到文件中：

import {LinearGradient} from 'expo-linear-gradient';

worked for me !

对我很管用！

Check whether these two lines are in your 'package file'.

检查这两行是否在您的‘程序包文件’中。

'React', :path => '../node_modules/react-native'

'BVLinearGradient', :path =>
'../node_modules/react-native-linear-gradient'

If yes then --

如果是，那么--

Run "pod install" under $project path/ios before react-native run-ios.

Cheers!!

干杯！！

I had similar issue with Android.
Solution: Kill the app and relaunch this should solve the problem

我在安卓系统上也遇到了类似的问题。解决方案：关闭应用程序并重新启动这应该可以解决问题

Easy Way..! Try This..!

简单的方式..！试试这个..！

1. Run this code in Terminal window

   
   

   expo install expo-linear-gradient

   
   



2. Use this code to import the LinearGradient

   
   

   import { LinearGradient } from "expo-linear-gradient";

   
   

Simple use a expo command.

只需使用EXPO命令即可。

• npm install expo-linear-gradient

Use this on the page

在页面上使用此选项

• import { LinearGradient } from "expo-linear-gradient";

Simply you just need to go to ios folder

您只需进入iOS文件夹即可

cd ios
pod install

That's it

就这样

First, install the https://github.com/react-native-community/react-native-linear-gradient library.

首先，安装https://github.com/react-native-community/react-native-linear-gradient库。

then go to the cd ios and run

然后转到CD iOS并运行

cd ios
pod install

now use go back using cd ..

现在使用CD返回。

and run (optional )

和运行(可选)

 react-native link react-native-linear-gradient

now run

现在快跑吧

react-native run-ios

Android

If you are on android, simply do the native rebuild again with:

如果您使用的是Android，只需使用以下命令再次执行本机重建：

yarn android

or

或

npm run android

• step 1 - npm install expo-linear-gradient


• setp 2 - import { LinearGradient } from expo-linear-gradient

For Expo users, running npx expo prebuild fixed it for me. And make sure you rebuild your app again. Here's the prebuild commands based on your platform:

对于世博会用户，运行npx expo preBuild为我修复了它。并确保再次重新构建您的应用程序。以下是基于您的平台的预构建命令：

IOS:

npx expo prebuild --platform ios && npx expo run:ios

Android:

npx expo prebuild --platform android && npx expo run:android

If using expo and this error is thrown after installing react-native-linear-gradient follow along.

如果使用expo并且在安装react-native-linear-gradient后抛出此错误，请遵循。

error ? the expo framework still does not have "sight" of the linear gradient package .

错误？世博会框架仍然看不到线性渐变套餐。

solution ? Run the command "expo install expo-linear-gradient" from your root folder, go to the file that you had previously imported the linear gradient as "import LinearGradient from 'react-native-linear-gradient" and change the line to "import {LinerGradient} from 'expo-linear-gradient'".

解决方案？从根文件夹运行命令“expo Install EXPO-LINEAR-GRADERATER”，转到您之前导入线性渐变的文件“IMPORT LinearGRadient from‘Reaction-Native-LineGradient”，并将该行更改为“IMPORT{LinerGRadient}from’expo-lineLINE-GRADIATER‘”。

Restart your server, "expo start".
PS: This solution is only applicable for react-native projects being built using expo

重启你的服务器，“世博会开始”。PS：此解决方案仅适用于使用expo构建的react原生项目

if you're using windows & react-native cli (not expo):

如果您使用的是Windows&Reaction-Native CLI(不是EXPO)：

1- in android/settings.gradle, check if

1-在Android/settings.gradle中，检查是否

include ':react-native-linear-gradient'
project(':react-native-linear-gradient').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-linear-gradient/android')

INCLUDE‘：REACTION-Native-LINEAR-GRADIRED’project(‘：react-native-linear-gradient’).projectDir=新建文件(根项目.项目目录，‘../node_modules/react-native-linear-gradient/android’)

exist .. if not, add them

存在..如果没有，则添加它们

---

2- in android/app/build.gradle, check if

2-在安卓/APP/build.gradle中，检查是否

implementation project(':react-native-linear-gradient')

exists in dependecies{ ... } .. if not, add it

存在于依赖关系中{...}..如果没有，则添加它

---

3- in android/app/src/main/java/com/{YOUR_APP_NAME}/MainApplication.java , find

3-在android/app/src/main/java/com/{YOUR_APP_NAME}/MainApplication.java中，找到

@Override
protected List getPackages() { ....}

@覆盖受保护列表getPackages(){...}

Then replace the comment // packages.add(new MyReactNativePackage());

然后替换注释//Packages.add(new MyReactNativePackage())；

with =>
packages.add(new LinearGradientPackage());

With=>Packages.add(new LinearGRadientPackage())；

• cd iOS


• bundle install


• bundle exec pod install