小程序实现卡片横向滚动 滚动到中间的卡片变大

好的，我明白了您的问题。您可以按照以下步骤实现卡片横向滚动，并且滚动到中间的卡片变大：

1. 在小程序的wxml文件中，使用scroll-view组件来实现卡片的横向滚动。设置scroll-x属性为true，表示支持横向滚动。

2. 在scroll-view内部使用一个view组件包裹每一个卡片，并设置每个卡片的宽度和高度。

3. 在每个卡片的view组件上绑定一个点击事件，并在事件处理函数中记录当前点击的卡片的位置。

4. 在scroll-view组件上绑定一个scroll事件，并在事件处理函数中获取当前滚动的位置，计算当前处于中间位置的卡片的位置，并将其放大。

以下是示例代码：

<!-- wxml文件 -->
<scroll-view scroll-x="true" bindscroll="onScroll">
  <view class="card" style="width: 200px; height: 300px;" bindtap="onCardTap" data-index="0">卡片1</view>
  <view class="card" style="width: 200px; height: 300px;" bindtap="onCardTap" data-index="1">卡片2</view>
  <view class="card" style="width: 200px; height: 300px;" bindtap="onCardTap" data-index="2">卡片3</view>
  <view class="card" style="width: 200px; height: 300px;" bindtap="onCardTap" data-index="3">卡片4</view>
</scroll-view>

// js文件
Page({
  data: {
    selectedCardIndex: 0
  },

  onCardTap: function(e) {
    this.setData({
      selectedCardIndex: e.currentTarget.dataset.index
    })
  },

  onScroll: function(e) {
    const cardWidth = 200 // 每个卡片的宽度
    const scrollLeft = e.detail.scrollLeft // 当前滚动的位置
    const windowWidth = wx.getSystemInfoSync().windowWidth // 屏幕宽度
    const centerCardIndex = Math.round(scrollLeft / cardWidth) // 当前处于中间位置的卡片的索引
    const selectedCardIndex = this.data.selectedCardIndex // 当前选中的卡片的索引

    if (centerCardIndex !== selectedCardIndex) {
      this.setData({
        selectedCardIndex: centerCardIndex
      })
    }
  }
})

在上述代码中，我们首先在wxml文件中定义了一个scroll-view组件，并在其中使用了四个view组件来显示卡片。每个卡片的宽度设置为200px，高度设置为300px。我们在每个卡片的view组件上绑定了一个点击事件，用于记录当前选中的卡片的索引。

然后，在js文件中，我们定义了一个onScroll函数，用于监听scroll-view组件的滚动事件。在滚动事件中，我们首先获取了每个卡片的宽度、当前滚动的位置、屏幕宽度等参数，然后计算出当前处于中间位置的卡片的索引。如果当前处于中间位置的卡片的索引与之前选中的卡片的索引不同，就更新selectedCardIndex的值，从而实现了滚动到中间的卡片变大的效果。