carousel did not support custom dot styles

[qingtong234]

RN组件carousel不支持自定义dot样式呀。
在pagination里面有定义Styles，但是carousel里面没有传递styles。。。。

else if (mode === 'pointer') {
      const arr: any = [];
      for (let i = 0; i < total; i++) {
        arr.push(
          <View
            key={`dot-${i}`}
            style={[ styles.pointStyle, styles.spaceStyle, i === current && styles.pointActiveStyle ]}
          />,
        );

以下是pagination代码：

 <Pagination
        style={[styles.pagination, styles[positionStyle]]}
        indicatorStyle={{ flexDirection }}
        current={index}
        mode="pointer"
        total={count}
      />

[silentcloud]

RN ? @qingtong234

[qingtong234]

@silentcloud 是的

[silentcloud]

@qingtong234 你可以先暂时写一个类似这样的脚本 https://github.com/ant-design/antd-mobile-samples/blob/master/rn-custom-ui/scripts/custom-rn-theme.js
在 start server 前动态修改 pagination 的 style/index.js 里的样式文件来解决

[qingtong234]

@silentcloud 后续可以什么时候实现，这样做本地开发么问题，但是rn打包不支持

[paranoidjk]

@qingtong234 为什么不支持？没看太懂，这里不是把props.style传下去了么？ https://github.com/ant-design/ant-design-mobile/blob/master/components/carousel/index.tsx#L233

[qingtong234]

@paranoidjk 注意在carousel里面传递的是style属性，而在pagination里面接收的是styles属性，所以pagination里面永远收不到style

[silentcloud]

这个要改的话，需要 RN Carousel 支持传入自定义 pagination，不然就算给内置的开一个 xxxStyle 的属性也没办法完全自定义的，除非 Pagination 将大部分样式开放 @qingtong234 ，比如 Pagination 的 activeTextStyle， totalStyle, pointStyle, pointActiveStyle 太多了，还是用脚本动态改最好，不会 build 不行的

[paranoidjk]

@silentcloud 我倾向于 【RN Carousel 支持传入自定义 pagination】，传 React.Element 自由度更大，实现成本也更低。

[silentcloud]

@paranoidjk 我也是这个想法

[paranoidjk]

@silentcloud 但是这里可能要做成 HOC 的形式，因为 会有个类似 activeCarouselIndex 的 props

[paranoidjk]

@silentcloud https://github.com/react-component/slider/blob/master/examples/handle.js#L14

[silentcloud]

恩， renderDots props 就行了，就两个参数，index 和 count，然后用户将自己自定义的 Pagination render 过来就好

[silentcloud]

@qingtong234 打包没问题的，在打包前覆盖就行了，后面要改也是放再 1.1 里的

[qingtong234]

@paranoidjk 1.1并没有支持，请问1.2发布计划是什么时候

[silentcloud]

@qingtong234 这个是个增强功能，只是新增了个 api，随后的 1.1.x 就发了，不用等 1.2了
cc @paranoidjk

[paranoidjk]

@silentcloud 合掉了，RN 没那么大业务包袱。我们尽量还是严格 semver。

[muhlishp33]

you can use dotStyle or dotActiveStyle in your Carousel Prop

<Carousel
autoplay
autoplayInterval={5000}
infinite
dotStyle={{marginBottom: 45}}
dotActiveStyle={}

//images
Carousel>

thx