Card14Component.ets 3.77 KB
import { ContentDTO } from 'wdBean';
import { RmhTitle } from '../cardCommon/RmhTitle'
import { CardMediaInfo } from '../cardCommon/CardMediaInfo'
import { CommonConstants } from 'wdConstant/Index';

const TAG = 'Card14Component';

/**
 * 人民号-动态---14:人民号单图卡;
 */
@Component
export struct Card14Component {
  @State contentDTO: ContentDTO = {
    // appStyle: '20',
    // coverType: 1,
    // coverUrl: 'https://rmrbcmsonline.peopleapp.com/upload/user_app/gov_dynamic/video/default_image/202105/rmrb_default_image_4GdWrgSw1622451312.jpg?x-oss-process=image/resize,m_fill,h_480,w_360/quality,q_90',
    // fullColumnImgUrls: [
    //   {
    //     landscape: 1,
    //     size: 1,
    //     url: 'https://rmrbcmsonline.peopleapp.com/upload/user_app/gov_dynamic/video/default_image/202105/rmrb_default_image_4GdWrgSw1622451312.jpg?x-oss-process=image/resize,m_fill,h_480,w_360/quality,q_90',
    //     weight: 1600
    //   }
    // ],
    // newsTitle: '好玩!》10后少年音乐人10后少年音乐人10后少年音乐人10后少年音乐人10后少年音乐人10后少年音乐人10后少年音乐人10后少年音乐人10后少年音乐人10后少年音乐人10后少年音乐人10后少年音乐人10后少年音乐人10后少年音乐人10后少年音乐人10后少年音乐人10后少年音乐人10后少年音乐人10后少年音乐人10后少年音乐人',
    // rmhInfo: {
    //   authIcon:
    //   'https://cdnjdphoto.aikan.pdnews.cn/creator-category/icon/auth/yellow.png',
    //   authTitle: '10后音乐人王烁然个人人民号',
    //   authTitle2: '10后音乐人王烁然个人人民号',
    //   banControl: 0,
    //   cnIsAttention: 1,
    //   rmhDesc: '10后少年音乐人10后少年音乐人10后少年音乐人10后少年音乐人10后少年音乐人',
    //   rmhHeadUrl: 'https://cdnjdphoto.aikan.pdnews.cn/image/creator/rmh/20221031/3d3419e86a.jpeg?x-oss-process=image/resize,l_100/auto-orient,1/quality,q_90/format,jpg',
    //   rmhName: '王烁然',
    //   userId: '522435359667845',
    //   userType: '2'
    // },
    // objectType: '1',
    // videoInfo: {
    //   firstFrameImageUri: '',
    //   videoDuration: 37,
    //   videoUrl: 'https://rmrbcmsonline.peopleapp.com/upload/user_app/gov_dynamic/video/mp4/202105/rmrb_GSNARt6P1622451310.mp4'
    // }
  } as ContentDTO;

  aboutToAppear(): void {
  }

  build() {
    Column() {
      // rmh信息
      RmhTitle({ rmhInfo: this.contentDTO.rmhInfo })
      // 左标题,右图
      Flex({ direction: FlexDirection.Row }) {

        Text(this.contentDTO.newsTitle)
          .fontSize($r('app.float.font_size_17'))
          .fontColor($r('app.color.color_222222'))
          .textOverflowStyle(3)
          .lineHeight(25)
          .fontFamily('PingFang SC-Regular')
          .textAlign(TextAlign.Start)
          .flexBasis('auto')
          .margin({right: 12})

        Image(this.contentDTO.coverUrl)
          .flexBasis(174)
          .height(75)
          .borderRadius($r('app.float.image_border_radius'))
        // .flexBasis(160)
        .backgroundImageSize(ImageSize.Auto)

      }
      .width(CommonConstants.FULL_WIDTH)
      .margin({ bottom: 8 })
      .height(75)


      //TODO  底部的:分享、评论、点赞 功能;需要引用一个公共组件
    }
    .padding({
      left: $r('app.float.card_comp_pagePadding_lf'),
      right: $r('app.float.card_comp_pagePadding_lf'),
      top: $r('app.float.card_comp_pagePadding_tb'),
      bottom: $r('app.float.card_comp_pagePadding_tb')
    })
  }
}

interface radiusType {
  topLeft: number | Resource;
  topRight: number | Resource;
  bottomLeft: number | Resource;
  bottomRight: number | Resource;
}

@Extend(Text)
function textOverflowStyle(maxLine: number) {
  .maxLines(maxLine)
  .textOverflow({ overflow: TextOverflow.Ellipsis })
}