Support for have image as column headers?

[rayson-intrack]

Does this library have the option render image as column headers? Or any React node?

[dosubot[bot]]

The react-native-reanimated-table library doesn't natively support rendering images or React nodes as column headers directly in its documentation. However, you can achieve this by customizing the Row component used for headers. Instead of passing a simple array of strings for headers, you can pass an array of custom React components, such as images or views containing text and images. Here's how you could implement it:

import React from 'react';
import { Image, View, Text } from 'react-native';
import { Table, Row } from 'react-native-reanimated-table';

const CustomHeader = () => {
  const tableHead = [
    <Image source={{uri: 'image_url_here'}} style={{width: 50, height: 50}} />,
    <View><Text>Head2</Text></View>,
    <View><Text>Head3</Text></View>,
    <View><Text>Head4</Text></View>
  ];

  return (
    <Table>
      <Row data={tableHead} style={{height: 60}} />
      {/* Rows data here */}
    </Table>
  );
};

export default CustomHeader;

This approach allows you to use images or any React node as column headers by replacing the strings in the tableHead array with custom components. Keep in mind, this is a workaround and not a documented feature, so it's important to test thoroughly.

#### Details

**Sources** - [README.md](https://github.com/dohooo/react-native-reanimated-table/blob/main/README.md)
**About Dosu** This response is meant to be useful and save you time. It is **not meant to be a precise solution**, but rather a starting point for your own research. Help me be more useful! Please leave a 👍 if this is helpful and 👎 if it is irrelevant.

To continue the conversation, mention @dosu.

[rayson-intrack]

Great, this works.