Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
M
mayi-mp-shop
Overview
Overview
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
程默
mayi-mp-shop
Commits
8db45656
Commit
8db45656
authored
Apr 27, 2021
by
程智春
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
图片画廊图片样式
parent
c8d609dc
Hide whitespace changes
Inline
Side-by-side
Showing
3 changed files
with
60 additions
and
3 deletions
+60
-3
static/nativeComponents/PhotoGallery/index.js
+57
-0
static/nativeComponents/PhotoGallery/index.wxml
+1
-1
static/nativeComponents/PhotoGallery/index.wxss
+2
-2
No files found.
static/nativeComponents/PhotoGallery/index.js
View file @
8db45656
...
...
@@ -31,6 +31,8 @@ Component({
'value'
:
0
}
],
imgArr
:
[],
lenI
:
0
},
ready
(){
console
.
log
(
this
.
data
.
datas
.
componentData
.
paddingList
,
'this.data.datas.componentData.paddingList'
)
...
...
@@ -39,6 +41,14 @@ Component({
getPaddingList
:
this
.
data
.
datas
.
componentData
.
paddingList
})
}
this
.
data
.
datas
.
componentData
.
imgList
.
forEach
((
item
,
index
)
=>
{
this
.
setData
({
[
'imgArr['
+
index
+
'].width'
]
:
''
,
[
'imgArr['
+
index
+
'].height'
]:
''
})
})
},
/**
...
...
@@ -48,6 +58,53 @@ Component({
itemClick
(
e
){
let
item
=
e
.
currentTarget
.
dataset
.
item
app
.
$themeToLink
(
item
.
link
)
},
bindload
(
e
){
console
.
log
(
e
,
'宽高'
)
let
index
=
e
.
currentTarget
.
dataset
.
index
;
let
width
=
e
.
detail
.
width
let
height
=
e
.
detail
.
height
console
.
log
(
index
,
width
,
height
)
this
.
setData
({
lenI
:
this
.
data
.
lenI
+
1
})
this
.
setData
({
[
'imgArr['
+
index
+
'].width'
]:
width
,
[
'imgArr['
+
index
+
'].height'
]:
height
})
if
(
this
.
data
.
lenI
==
this
.
data
.
datas
.
componentData
.
imgList
.
length
){
let
countWidth
=
0
;
this
.
data
.
imgArr
.
forEach
(
item
=>
{
countWidth
+=
Number
(
item
.
width
)
})
console
.
log
(
countWidth
,
'countWidth'
)
const
res
=
wx
.
getSystemInfoSync
()
let
b
=
countWidth
/
res
.
windowWidth
console
.
log
(
b
,
'nnnnn'
)
this
.
data
.
imgArr
.
forEach
((
it
,
ii
)
=>
{
this
.
setData
({
[
'imgArr['
+
ii
+
'].width'
]:
it
.
width
/
b
,
[
'imgArr['
+
ii
+
'].height'
]:
it
.
height
/
b
})
})
}
}
}
})
static/nativeComponents/PhotoGallery/index.wxml
View file @
8db45656
...
...
@@ -17,7 +17,7 @@
</view>
<view style="display:{{datas.componentData.style==='tiled' ? 'flex' : ''}}" class="ul">
<view bindtap="itemClick" data-item="{{item}}" wx:for="{{datas.componentData.imgList}}" wx:key="{{index}}" style="margin-right:{{index===(datas.componentData.imgList.length-1)? '' : datas.componentData.imgPadding * 2 + 'rpx'}};width:{{datas.componentData.style==='across' ? datas.componentData.acrossPer+'%' : ''}}" class="li">
<image src="{{item.imageUrl}}"
lazy-load mode="widthFix
"></image>
<image src="{{item.imageUrl}}"
style="width:{{datas.componentData.style==='tiled' ? imgArr[index].width : ''}}px;height:{{ datas.componentData.style==='tiled' ? imgArr[index].height : ''}}px" lazy-load bindload="bindload" data-index="{{index}}" mode="{{datas.componentData.style==='across' ? 'widthFix' : ''}}
"></image>
</view>
</view>
</view>
...
...
static/nativeComponents/PhotoGallery/index.wxss
View file @
8db45656
...
...
@@ -28,11 +28,11 @@
}
.ul .li{
display: inline-block;
flex: 1
flex: 1
;
}
.ul .li image{
width: 100%;
vertical-align: middle;
display: inline-block
}
.prev-btn,.next-btn{
width: 60rpx;
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment