Documentation Index
Fetch the complete documentation index at: /llms.txt
Use this file to discover all available pages before exploring further.
@amazon-devices/expo-linear-gradient provides a native React view that transitions between multiple colors in a linear direction.
@amazon-devices/expo-linear-gradient provides a native React view that transitions between multiple colors in a linear direction.
package.json file. Select the tab for your React Native version.dependencies: {
...
"@amazon-devices/expo-linear-gradient": "~2.0.0",
}
dependencies: {
...
"@amazon-devices/expo-linear-gradient": "~3.0.0",
}
npm install command.import React from 'react';
import {LinearGradient} from '@amazon-devices/expo-linear-gradient';
export const App = () => {
return (
<LinearGradient
colors={['white', 'red']}
start={[0.5, 0.5]}
end={[1, 1]}
style={{
width: 100,
maxHeight: 200,
minHeight: 200,
borderWidth: 1,
marginVertical: 20,
borderColor: 'black',
}}
/>
);
};
| Component | Description |
|---|---|
LinearGradient | Renders a native view that transitions between multiple colors in a linear direction |
| Prop | Description |
|---|---|
colors | An array of colors that represent stops in the gradient. At least two colors are required (for a single-color background, use the style.backgroundColor prop on a View component) |
start | For example, { x: 0.1, y: 0.2 } means that the gradient will start 10% from the left and 20% from the top |
end | For example, { x: 0.1, y: 0.2 } means that the gradient will end 10% from the left and 20% from the bottom |
locations | An array that contains numbers ranging from 0 to 1, inclusive, and is the same length as the colors property. Each number indicates a color-stop location where each respective color should be located. If not specified, the colors will be distributed evenly across the gradient |
このページは役に立ちましたか？
© 2010-2026, Amazon.com, Inc. or its affiliates. All Rights Reserved. 無断複写·転載を禁じます。