liujian1_wd

电子报页面

Showing 30 changed files with 533 additions and 43 deletions
... ... @@ -5,13 +5,13 @@
"name": "default",
"type": "HarmonyOS",
"material": {
"certpath": "C:\\Users\\PC\\.ohos\\config\\auto_debug_sight_harmony_com.wondertek.sight_70086000309521319.cer",
"storePassword": "0000001AB8EC943F2BE2E18A8AEFE1FCA450B66E91DFD2548DD09FD6AB15755699E084327B0CC2ED695B",
"certpath": "C:\\Users\\PC\\.ohos\\config\\auto_debug_sight_harmony_com.wondertek.sight_70086000327424393.cer",
"storePassword": "0000001B4100D63EDF7155D2954BDDEC8F40FA74E710B0D1FF3C0782DE2745F90F1B83D1C1C110398F4559",
"keyAlias": "debugKey",
"keyPassword": "0000001AAB9FF41A89BB2C32EA7122E2EE2E6C97447932FDC7E91010CC02128130B6040A09EBC04CD07E",
"profile": "C:\\Users\\PC\\.ohos\\config\\auto_debug_sight_harmony_com.wondertek.sight_70086000309521319.p7b",
"keyPassword": "0000001B157D6824BE8F21F112459AD1B61654DE9396A50B0CE60898F02F4C95CBF127122F293DD6C80C62",
"profile": "C:\\Users\\PC\\.ohos\\config\\auto_debug_sight_harmony_com.wondertek.sight_70086000327424393.p7b",
"signAlg": "SHA256withECDSA",
"storeFile": "C:\\Users\\PC\\.ohos\\config\\auto_debug_sight_harmony_com.wondertek.sight_70086000309521319.p12"
"storeFile": "C:\\Users\\PC\\.ohos\\config\\auto_debug_sight_harmony_com.wondertek.sight_70086000327424393.p12"
}
}
],
... ... @@ -134,17 +134,17 @@
}
]
}
// {
// "name": "wdLayout",
// "srcPath": "./wdLayout",
// "targets": [
// {
// "name": "default",
// "applyToProducts": [
// "default"
// ]
// }
// ]
// }
// {
// "name": "wdLayout",
// "srcPath": "./wdLayout",
// "targets": [
// {
// "name": "default",
// "applyToProducts": [
// "default"
// ]
// }
// ]
// }
]
}
\ No newline at end of file
... ...
import { ENewspaperPageComponent } from 'wdComponent';
import { Logger } from 'wdKit'
const TAG = 'ENewspaper';
@Entry
@Component
struct ENewspaper {
build() {
Column() {
ENewspaperPageComponent()
}
}
pageTransition(){
// 定义页面进入时的效果,从底侧滑入
PageTransitionEnter({ type: RouteType.None, duration: 300 })
.slide(SlideEffect.Bottom)
// 定义页面退出时的效果,向底侧滑出
PageTransitionExit({ type: RouteType.None, duration: 300 })
.slide(SlideEffect.Bottom)
}
aboutToAppear() {
Logger.info(TAG, 'aboutToAppear');
}
aboutToDisappear() {
Logger.info(TAG, 'aboutToDisappear');
}
onPageShow() {
Logger.info(TAG, 'onPageShow');
}
onPageHide() {
Logger.info(TAG, 'onPageHide');
}
onBackPress() {
Logger.info(TAG, 'onBackPress');
}
}
\ No newline at end of file
... ...
{
"src": [
"pages/Index",
"pages/web/DefaultWebPage"
"pages/web/DefaultWebPage",
"pages/ENewspaper"
]
}
}
\ No newline at end of file
... ...
This diff could not be displayed because it is too large.
{
"code": "0",
"data": [{
"date": "49997-06-15",
"list": [{
"exist": 1,
"pageName": "",
"pageNum": "05",
"periodNum": "49997-06-15"
}]
}],
"message": "Success",
"meta": null,
"requestId": "",
"success": true,
"timestamp": 1706170629625
}
\ No newline at end of file
... ...
... ... @@ -39,3 +39,15 @@ export { GroupDTO } from './src/main/ets/bean/component/GroupDTO';
export { CompDTO } from './src/main/ets/bean/component/CompDTO';
export { ContentDTO } from './src/main/ets/bean/component/ContentDTO';
export { NewspaperListBean } from './src/main/ets/bean/newspaper/NewspaperListBean';
export { NewspaperListItemBean } from './src/main/ets/bean/newspaper/NewspaperListItemBean';
export { NewspaperPositionItemBean } from './src/main/ets/bean/newspaper/NewspaperPositionItemBean';
export { NewspaperShareBean } from './src/main/ets/bean/newspaper/NewspaperShareBean';
export { NewspaperTimeInfoBean} from './src/main/ets/bean/newspaper/NewspaperTimeInfoBean';
export { NewspaperTimeItemBean } from './src/main/ets/bean/newspaper/NewspaperTimeItemBean';
... ...
import { NewspaperListItemBean } from './NewspaperListItemBean';
export interface NewspaperListBean {
list:NewspaperListItemBean[];
}
\ No newline at end of file
... ...
import { NewspaperPositionItemBean } from './NewspaperPositionItemBean';
import { NewspaperShareBean } from './NewspaperShareBean';
export interface NewspaperListItemBean {
items:NewspaperPositionItemBean[];
pageName:string;
pageNum:string;
pagePic:string;
periodNum:string;
sharePagePic:NewspaperShareBean;
}
\ No newline at end of file
... ...
export interface NewspaperPositionItemBean {
image:string[];
downTitle:string;
imageHeight:number;
imageWidth:number;
newsId:number;
newsTxt:string;
newsType:number;
points:string;
relId:number;
relObjectId: string;
relType: string;
shortTitle: string;
title: string;
}
\ No newline at end of file
... ...
export interface NewspaperShareBean {
shareUrl:string;
sharePosterOpen:number;
}
\ No newline at end of file
... ...
import { NewspaperTimeItemBean } from './NewspaperTimeItemBean';
export interface NewspaperTimeInfoBean {
date:string;
list:NewspaperTimeItemBean[];
}
\ No newline at end of file
... ...
export interface NewspaperTimeItemBean {
pageName:string;
pageNum:string;
periodNum:string;
exit:number;
}
\ No newline at end of file
... ...
... ... @@ -25,3 +25,7 @@ export { SingleColumnComponent } from "./src/main/ets/components/SingleColumnCom
export { GridLayout01Component } from "./src/main/ets/components/GridLayout01Component"
export { WaterFlowComponent } from "./src/main/ets/components/WaterFlowComponent"
export { NewspaperViewModel} from "./src/main/ets/viewmodel/NewspaperViewModel"
export {ENewspaperPageComponent} from "./src/main/ets/components/ENewspaperPageComponent"
... ...
... ... @@ -10,7 +10,7 @@
"wdConstant": "file:../wdConstant",
"wdKit": "file:../wdKit",
"wdBean": "file:../wdBean",
"wdNetwork": "file:../wdNetwork",
"wdRouter": "file:../wdRouter"
"wdRouter": "file:../wdRouter",
"wdNetwork": "file:../wdNetwork"
}
}
... ...
import { NewspaperListItemBean, NewspaperPositionItemBean } from 'wdBean';
import { StringUtils } from 'wdKit';
@Component
export struct ENewspaperItemComponent {
private newspaperListItemBean: NewspaperListItemBean = {} as NewspaperListItemBean
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
build() {
Stack() {
Image(this.newspaperListItemBean.pagePic)
.width('100%')
.height('100%')
.objectFit(ImageFit.Contain)
Canvas(this.context)
.width('100%')
.height('100%')
.backgroundColor(Color.Transparent)
.onReady(() => {
})
}
.width('100%')
.aspectRatio(0.7)
.onTouch((event: TouchEvent) => {
if (event.type === TouchType.Down) {
let x = event.touches[0].x;
let y = event.touches[0].y;
let points: number[][] = this.getArea(x, y, this.newspaperListItemBean.items);
if (points && points.length > 2){
let path = new Path2D();
path.moveTo(px2vp(points[0][0]), px2vp(points[0][1]));
for(let point of points.slice(1, points.length)){
path.lineTo(px2vp(point[0]), px2vp(point[1]));
}
path.closePath();
// 设定填充色为蓝色
this.context.fillStyle = '#33000000';
// 使用填充的方式,将Path2D描述的五边形绘制在canvas组件内部
this.context.fill(path);
}
}
if (event.type === TouchType.Up) {
this.context.clearRect(0, 0, this.context.width, this.context.height)
}
if (event.type === TouchType.Move) {
// this.context.clearRect(0, 0, this.context.width, this.context.height)
}
})
}
public getArea(x: number, y: number, itemBeans: NewspaperPositionItemBean[]): number[][] {
if (itemBeans && itemBeans.length > 0) {
for (let itemBean of itemBeans) {
if (itemBean.points) {
let area: string[] = itemBean.points.split(';')
if (area && area.length > 0) {
let xys: number[][] = []
let minX: number = -1;
let maxX: number = -1;
let minY: number = -1;
let maxY: number = -1;
for (let item of area) {
let pair: string[] = item.split(',');
if (pair && pair.length > 1) {
let xy: number[] = [StringUtils.parseNumber(pair[0]), StringUtils.parseNumber(pair[1])]
if (minX < 0) {
minX = xy[0]
} else {
if (minX > xy[0]) {
minX = xy[0]
}
}
if (maxX < 0) {
maxX = xy[0]
} else {
if (maxX < xy[0]) {
maxX = xy[0]
}
}
if (minY < 0) {
minY = xy[1]
} else {
if (minY > xy[1]) {
minY = xy[1]
}
}
if (maxY < 0) {
maxY = xy[1]
} else {
if (maxY < xy[1]) {
maxY = xy[1]
}
}
xys.push(xy);
}
}
if (vp2px(x) > minX && vp2px(x) < maxX && vp2px(y) > minY && vp2px(y) < maxY) {
return xys;
}
}
}
}
}
return []
}
}
\ No newline at end of file
... ...
import { NewspaperListBean, NewspaperListItemBean } from 'wdBean'
import { NewspaperViewModel } from '../viewmodel/NewspaperViewModel'
import router from '@ohos.router'
import { ENewspaperItemComponent } from './ENewspaperItemComponent'
@Component
export struct ENewspaperPageComponent {
@State newspaperListBean: NewspaperListBean = {} as NewspaperListBean
@State currentPageNum: string = '01';
private swiperController: SwiperController = new SwiperController()
build() {
RelativeContainer() {
RelativeContainer() {
Image($r('app.media.icon_arrow_down'))
.height($r('app.float.top_arrow_size'))
.width($r('app.float.top_arrow_size'))
.alignRules({ left: { anchor: "__container__", align: HorizontalAlign.Start },
center: { anchor: "__container__", align: VerticalAlign.Center } })
.id('e_newspaper_back')
.onClick((event: ClickEvent) => {
router.back()
})
Row() {
Text('2024.01.26')
.fontSize($r('app.float.font_size_20'))
.fontColor($r('app.color.white'))
Image($r('app.media.icon_triangle'))
.width($r('app.float.border_radius_6'))
.height($r('app.float.border_radius_6'))
.margin({ left: 2, bottom: 5 })
}
.alignItems(VerticalAlign.Bottom)
.alignRules({ middle: { anchor: "__container__", align: HorizontalAlign.Center },
center: { anchor: "__container__", align: VerticalAlign.Center } })
.id('e_newspaper_date')
Image($r('app.media.icon_share'))
.height($r('app.float.top_arrow_size'))
.width($r('app.float.top_arrow_size'))
.alignRules({ right: { anchor: "__container__", align: HorizontalAlign.End },
center: { anchor: "__container__", align: VerticalAlign.Center } })
.id('e_newspaper_share')
}
.margin({ left: $r('app.float.margin_16'), right: $r('app.float.margin_16') })
.height($r('app.float.top_bar_height'))
.alignRules({ top: { anchor: '__container__', align: VerticalAlign.Top },
left: { anchor: '__container__', align: HorizontalAlign.Start },
right: { anchor: '__container__', align: HorizontalAlign.End } })
.id('e_newspaper_top')
if (this.newspaperListBean && this.newspaperListBean.list && this.newspaperListBean.list.length > 0) {
Swiper(this.swiperController) {
ForEach(this.newspaperListBean?.list, (item: NewspaperListItemBean, index: number) => {
ENewspaperItemComponent({newspaperListItemBean: item})
})
}
.width('100%')
.vertical(true)
.autoPlay(false)
.cachedCount(3)
.indicator(false)
.displayCount(1)
.aspectRatio(0.7)
.margin({ top: $r('app.float.vp_55'), left: 10, right: 10 })
.id('e_newspaper_content')
.alignRules({ top: { anchor: "e_newspaper_top", align: VerticalAlign.Bottom },
middle: { anchor: "__container__", align: HorizontalAlign.Center } })
.onChange((index: number) => {
this.currentPageNum = this.newspaperListBean?.list[index]?.pageNum
})
Image($r('app.media.newspaper_shadow'))
.height($r('app.float.vp_12'))
.margin({ left: 12, right: 12, top: -2 })
.objectFit(ImageFit.Contain)
.alignRules({ top: { anchor: "e_newspaper_content", align: VerticalAlign.Bottom },
left: { anchor: 'e_newspaper_content', align: HorizontalAlign.Start },
right: { anchor: 'e_newspaper_content', align: HorizontalAlign.End } })
.id('e_newspaper_shadow')
Row() {
Text('滑动查看下一版')
.fontColor(Color.White)
.fontSize($r('app.float.font_size_14'))
Image($r('app.media.icon_next_page'))
.width($r('app.float.vp_16'))
.height($r('app.float.vp_16'))
}
.justifyContent(FlexAlign.Center)
.margin({ top: $r('app.float.margin_16') })
.alignRules({ top: { anchor: "e_newspaper_shadow", align: VerticalAlign.Bottom },
middle: { anchor: "__container__", align: HorizontalAlign.Center } })
.id('e_newspaper_next')
.onClick((event: ClickEvent) => {
this.swiperController.showNext()
})
}
Row() {
Text(this.currentPageNum)
.fontSize($r('app.float.font_size_36'))
.fontColor($r('app.color.white'))
Text('版')
.fontSize($r('app.float.font_size_16'))
.fontColor($r('app.color.white'))
.margin({ bottom: 6 })
Image($r('app.media.icon_triangle'))
.width($r('app.float.border_radius_6'))
.height($r('app.float.border_radius_6'))
.margin({ left: 2, bottom: 6 })
}
.alignItems(VerticalAlign.Bottom)
.margin({ left: $r('app.float.margin_16'), bottom: $r('app.float.top_tab_bar_height') })
.alignRules({ bottom: { anchor: '__container__', align: VerticalAlign.Bottom },
left: { anchor: '__container__', align: HorizontalAlign.Start } })
.id('e_newspaper_page_num')
Row() {
Image($r('app.media.icon_read_paper'))
.width($r('app.float.vp_20'))
.height($r('app.float.vp_20'))
.margin({ right: $r('app.float.vp_3') })
Text('读报纸')
.fontSize($r('app.float.font_size_14'))
.fontColor($r('app.color.white'))
}
.alignItems(VerticalAlign.Center)
.margin({ right: $r('app.float.margin_16'), bottom: $r('app.float.top_tab_bar_height') })
.alignRules({ bottom: { anchor: '__container__', align: VerticalAlign.Bottom },
right: { anchor: '__container__', align: HorizontalAlign.End } })
.id('e_newspaper_read')
}
.width('100%')
.height('100%')
.backgroundColor($r('app.color.color_80000000'))
.id('e_newspaper_container')
}
aboutToAppear() {
let listBean = NewspaperViewModel.getNewspaperListFromLocal(getContext(this));
this.newspaperListBean = listBean;
}
aboutToDisappear() {
}
}
\ No newline at end of file
... ...
import { GroupDTO, TopNavBean } from 'wdBean';
import { Action, GroupDTO, Params, TopNavBean } from 'wdBean';
import { LazyDataSource, Logger } from 'wdKit';
import { WDRouterRule } from 'wdRouter';
import { PageComponent } from './PageComponent';
const TAG = 'TopNavigationComponent';
... ... @@ -17,21 +18,36 @@ export struct TopNavigationComponent {
readonly MAX_LINE: number = 1;
build() {
Tabs() {
ForEach(this.topNavList, (navItem: TopNavBean, index: number) => {
TabContent() {
PageComponent({ groupList: this.groupList, currentTopNavSelectedIndex:index})
}
.tabBar(this.tabBarBuilder(navItem, index))
}, (navItem: TopNavBean) => JSON.stringify(navItem));
Column(){
Image($r('app.media.icon_ren_min_ri_bao'))
.width(72)
.height(29)
.onClick((event: ClickEvent) => {
let taskAction: Action = {
type: 'JUMP_INNER_NEW_PAGE',
params: {
pageID: 'E_NEWSPAPER'
} as Params,
};
WDRouterRule.jumpWithAction(taskAction)
})
Tabs() {
ForEach(this.topNavList, (navItem: TopNavBean, index: number) => {
TabContent() {
PageComponent({ groupList: this.groupList, currentTopNavSelectedIndex:index})
}
.tabBar(this.tabBarBuilder(navItem, index))
}, (navItem: TopNavBean) => JSON.stringify(navItem));
}
.barHeight($r('app.float.top_tab_bar_height'))
.barMode(BarMode.Scrollable)
.vertical(false)
.onChange((index: number) => {
Logger.info(TAG, `onChange index : ${index}`);
this.currentTopNavSelectedIndex = index;
})
}
.barHeight($r('app.float.top_tab_bar_height'))
.barMode(BarMode.Scrollable)
.vertical(false)
.onChange((index: number) => {
Logger.info(TAG, `onChange index : ${index}`);
this.currentTopNavSelectedIndex = index;
})
}
@Builder
... ...
import { BottomNavBean, GroupDTO, NavigationBody, NewspaperListBean, NewspaperTimeInfoBean } from 'wdBean';
import { Logger, ResourcesUtils } from 'wdKit';
import { ResponseDTO, WDHttp } from 'wdNetwork';
import { PageRepository } from '../repository/PageRepository';
import http from '@ohos.net.http';
import { BusinessError } from '@ohos.base';
const TAG = 'NewspaperViewModel';
export class NewspaperViewModel {
static getNewspaperTimeFromLocal(context: Context): NewspaperTimeInfoBean[] {
Logger.info(TAG, `getNewspaperTimeFromLocal start`);
let newspaperTimeInfo: ResponseDTO<NewspaperTimeInfoBean[]> | null = ResourcesUtils.getResourcesJsonSync<ResponseDTO<NewspaperTimeInfoBean[]>>(context, 'newspaper_info.json');
if (!newspaperTimeInfo || !newspaperTimeInfo.data) {
Logger.info(TAG, `getNewspaperTimeFromLocal List is empty`);
return []
}
return newspaperTimeInfo.data
}
static getNewspaperListFromLocal(context: Context): NewspaperListBean {
let newspaperListBean: ResponseDTO<NewspaperListBean> | null = ResourcesUtils.getResourcesJsonSync<ResponseDTO<NewspaperListBean>>(context, 'newspaper_datalist.json');
if (!newspaperListBean || !newspaperListBean.data) {
Logger.info(TAG, `getCompList compRes is empty`);
return {} as NewspaperListBean
}
return newspaperListBean.data
}
}
... ...
... ... @@ -19,6 +19,14 @@
{
"name": "color_FE4B05",
"value": "#FE4B05"
},
{
"name": "color_505050",
"value": "#505050"
},
{
"name": "color_80000000",
"value": "#80000000"
}
]
}
\ No newline at end of file
... ...
... ... @@ -32,7 +32,14 @@
"name": "font_size_24",
"value": "24fp"
},
{
"name": "font_size_20",
"value": "20fp"
},
{
"name": "font_size_36",
"value": "36fp"
},
{
"name": "main_margin",
"value": "14vp"
... ... @@ -104,6 +111,42 @@
{
"name": "top_tab_item_padding_top",
"value": "2vp"
},
{
"name": "top_bar_height",
"value": "44vp"
},
{
"name": "top_arrow_size",
"value": "24vp"
},
{
"name": "margin_16",
"value": "16vp"
},
{
"name": "vp_20",
"value": "20vp"
},
{
"name": "vp_3",
"value": "3vp"
},
{
"name": "vp_55",
"value": "55vp"
},
{
"name": "vp_12",
"value": "12vp"
},
{
"name": "vp_8",
"value": "8vp"
},
{
"name": "vp_16",
"value": "16vp"
}
]
}
\ No newline at end of file
... ...
... ... @@ -63,10 +63,10 @@ export function registerRouter() {
return WDRouterPage.defaultWebPage
})
// Action2Page.register("JUMP_INNER_NEW_PAGE", (action) => {
// if (action.params?.pageID == "WORLDCUP_DETAIL") {
// return WDRouterPage.livependantpage
// }
// return undefined
// })
Action2Page.register("JUMP_INNER_NEW_PAGE", (action) => {
if (action.params?.pageID == "E_NEWSPAPER") {
return WDRouterPage.eNewspaper
}
return undefined
})
}
\ No newline at end of file
... ...
... ... @@ -20,4 +20,6 @@ export class WDRouterPage {
// static aboutPage = new WDRouterPage("entry", "ets/pages/about/AboutPage");
// web默认页面
static defaultWebPage = new WDRouterPage("entry", "ets/pages/web/DefaultWebPage");
// 电子报页面
static eNewspaper = new WDRouterPage("entry", "ets/pages/ENewspaper")
}
... ...