Toggle navigation
Toggle navigation
This project
Loading...
Sign in
mobile
/
YH_RNComponent
·
Commits
Go to a project
GitLab
Go to group
Project
Activity
Files
Commits
Pipelines
0
Builds
0
Graphs
Milestones
Issues
0
Merge Requests
0
Members
Labels
Wiki
Forks
Network
Create a new issue
Download as
Plain Diff
Browse Files
Authored by
张丽霞
8 years ago
Commit
619a4272bb758bcf0cea7ec8e3783ebd5ac59f7f
2 parents
6c7ad10f
a81710a7
Merge branch '5.4.1' into student
Hide whitespace changes
Inline
Side-by-side
Showing
2 changed files
with
146 additions
and
124 deletions
js/common/components/YH_ViewPager.android.js
js/common/components/YH_ViewPager.js
js/common/components/YH_ViewPager.android.js
0 → 100644
View file @
619a427
/**
* Description:
*
* Author: Bruce.Lu
* Version: 1.0
* Created on 2017/2/23.
*/
import
React
from
'react'
;
import
ReactNative
from
'react-native'
;
let
{
requireNativeComponent
,
View
,
}
=
ReactNative
;
var
dismissKeyboard
=
require
(
'dismissKeyboard'
);
let
YH_ViewPagerView
=
requireNativeComponent
(
'YH_ViewPager'
,
null
);
var
UIManager
=
require
(
'UIManager'
);
type
Event
=
Object
;
var
VIEWPAGER_REF
=
'viewPager'
;
export
type
ViewPagerScrollState
=
$Enum
<
{
idle
:
string
,
dragging
:
string
,
settling
:
string
,
}
>
;
export
default
class
YH_ViewPager
extends
React
.
Component
{
props
:
{
initialPage
?:
number
,
onPageScroll
?:
Function
,
onPageScrollStateChanged
?:
Function
,
onPageSelected
?:
Function
,
pageMargin
?:
number
,
keyboardDismissMode
?:
'none'
|
'on-drag'
,
scrollEnabled
?:
boolean
,
};
static
propTypes
=
{
...
View
.
propTypes
,
initialPage
:
React
.
PropTypes
.
number
,
onPageScroll
:
React
.
PropTypes
.
func
,
onPageScrollStateChanged
:
React
.
PropTypes
.
func
,
onPageSelected
:
React
.
PropTypes
.
func
,
pageMargin
:
React
.
PropTypes
.
number
,
keyboardDismissMode
:
React
.
PropTypes
.
oneOf
([
'none'
,
// default
'on-drag'
,
]),
scrollEnabled
:
React
.
PropTypes
.
bool
,
};
constructor
(
props
)
{
super
(
props
);
}
componentDidMount
()
{
if
(
this
.
props
.
initialPage
!=
null
)
{
this
.
setPageWithoutAnimation
(
this
.
props
.
initialPage
);
}
}
_childrenWithOverridenStyle
=
()
:
Array
=>
{
// Override styles so that each page will fill the parent. Native component
// will handle positioning of elements, so it's not important to offset
// them correctly.
return
React
.
Children
.
map
(
this
.
props
.
children
,
function
(
child
)
{
if
(
!
child
)
{
return
null
;
}
var
newProps
=
{
...
child
.
props
,
style
:
[
child
.
props
.
style
,
{
position
:
'absolute'
,
left
:
0
,
top
:
0
,
right
:
0
,
bottom
:
0
,
width
:
undefined
,
height
:
undefined
,
}],
collapsable
:
false
,
};
if
(
child
.
type
&&
child
.
type
.
displayName
&&
(
child
.
type
.
displayName
!==
'RCTView'
)
&&
(
child
.
type
.
displayName
!==
'View'
))
{
console
.
warn
(
'Each ViewPager child must be a <View>. Was '
+
child
.
type
.
displayName
);
}
return
React
.
createElement
(
child
.
type
,
newProps
);
});
};
_onPageScroll
=
(
e
:
Event
)
=>
{
if
(
this
.
props
.
onPageScroll
)
{
this
.
props
.
onPageScroll
(
e
);
}
if
(
this
.
props
.
keyboardDismissMode
===
'on-drag'
)
{
dismissKeyboard
();
}
};
_onPageScrollStateChanged
=
(
e
:
Event
)
=>
{
if
(
this
.
props
.
onPageScrollStateChanged
)
{
this
.
props
.
onPageScrollStateChanged
(
e
.
nativeEvent
.
pageScrollState
);
}
};
_onPageSelected
=
(
e
:
Event
)
=>
{
if
(
this
.
props
.
onPageSelected
)
{
this
.
props
.
onPageSelected
(
e
);
}
};
setPage
=
(
selectedPage
:
number
)
=>
{
UIManager
.
dispatchViewManagerCommand
(
ReactNative
.
findNodeHandle
(
this
),
UIManager
.
AndroidViewPager
.
Commands
.
setPage
,
[
selectedPage
],
);
};
setPageWithoutAnimation
=
(
selectedPage
:
number
)
=>
{
UIManager
.
dispatchViewManagerCommand
(
ReactNative
.
findNodeHandle
(
this
),
UIManager
.
AndroidViewPager
.
Commands
.
setPageWithoutAnimation
,
[
selectedPage
],
);
};
render
()
{
return
(
<
YH_ViewPagerView
{...
this
.
props
}
ref
=
{
VIEWPAGER_REF
}
style
=
{
this
.
props
.
style
}
onPageScroll
=
{
this
.
_onPageScroll
}
onPageScrollStateChanged
=
{
this
.
_onPageScrollStateChanged
}
onPageSelected
=
{
this
.
_onPageSelected
}
children
=
{
this
.
_childrenWithOverridenStyle
()}
/>
)
;
}
}
...
...
js/common/components/YH_ViewPager.js
View file @
619a427
...
...
@@ -8,138 +8,15 @@
import
React
from
'react'
;
import
ReactNative
from
'react-native'
;
let
{
requireNativeComponent
,
View
,
}
=
ReactNative
;
var
dismissKeyboard
=
require
(
'dismissKeyboard'
);
let
YH_ViewPagerView
=
requireNativeComponent
(
'YH_ViewPager'
,
null
);
var
UIManager
=
require
(
'UIManager'
);
type
Event
=
Object
;
var
VIEWPAGER_REF
=
'viewPager'
;
export
type
ViewPagerScrollState
=
$Enum
<
{
idle
:
string
,
dragging
:
string
,
settling
:
string
,
}
>
;
export
default
class
YH_ViewPager
extends
React
.
Component
{
props
:
{
initialPage
?:
number
,
onPageScroll
?:
Function
,
onPageScrollStateChanged
?:
Function
,
onPageSelected
?:
Function
,
pageMargin
?:
number
,
keyboardDismissMode
?:
'none'
|
'on-drag'
,
scrollEnabled
?:
boolean
,
};
static
propTypes
=
{
...
View
.
propTypes
,
initialPage
:
React
.
PropTypes
.
number
,
onPageScroll
:
React
.
PropTypes
.
func
,
onPageScrollStateChanged
:
React
.
PropTypes
.
func
,
onPageSelected
:
React
.
PropTypes
.
func
,
pageMargin
:
React
.
PropTypes
.
number
,
keyboardDismissMode
:
React
.
PropTypes
.
oneOf
([
'none'
,
// default
'on-drag'
,
]),
scrollEnabled
:
React
.
PropTypes
.
bool
,
};
constructor
(
props
)
{
super
(
props
);
}
componentDidMount
()
{
if
(
this
.
props
.
initialPage
!=
null
)
{
this
.
setPageWithoutAnimation
(
this
.
props
.
initialPage
);
}
}
_childrenWithOverridenStyle
=
()
:
Array
=>
{
// Override styles so that each page will fill the parent. Native component
// will handle positioning of elements, so it's not important to offset
// them correctly.
return
React
.
Children
.
map
(
this
.
props
.
children
,
function
(
child
)
{
if
(
!
child
)
{
return
null
;
}
var
newProps
=
{
...
child
.
props
,
style
:
[
child
.
props
.
style
,
{
position
:
'absolute'
,
left
:
0
,
top
:
0
,
right
:
0
,
bottom
:
0
,
width
:
undefined
,
height
:
undefined
,
}],
collapsable
:
false
,
};
if
(
child
.
type
&&
child
.
type
.
displayName
&&
(
child
.
type
.
displayName
!==
'RCTView'
)
&&
(
child
.
type
.
displayName
!==
'View'
))
{
console
.
warn
(
'Each ViewPager child must be a <View>. Was '
+
child
.
type
.
displayName
);
}
return
React
.
createElement
(
child
.
type
,
newProps
);
});
};
_onPageScroll
=
(
e
:
Event
)
=>
{
if
(
this
.
props
.
onPageScroll
)
{
this
.
props
.
onPageScroll
(
e
);
}
if
(
this
.
props
.
keyboardDismissMode
===
'on-drag'
)
{
dismissKeyboard
();
}
};
_onPageScrollStateChanged
=
(
e
:
Event
)
=>
{
if
(
this
.
props
.
onPageScrollStateChanged
)
{
this
.
props
.
onPageScrollStateChanged
(
e
.
nativeEvent
.
pageScrollState
);
}
};
_onPageSelected
=
(
e
:
Event
)
=>
{
if
(
this
.
props
.
onPageSelected
)
{
this
.
props
.
onPageSelected
(
e
);
}
};
setPage
=
(
selectedPage
:
number
)
=>
{
UIManager
.
dispatchViewManagerCommand
(
ReactNative
.
findNodeHandle
(
this
),
UIManager
.
AndroidViewPager
.
Commands
.
setPage
,
[
selectedPage
],
);
};
setPageWithoutAnimation
=
(
selectedPage
:
number
)
=>
{
UIManager
.
dispatchViewManagerCommand
(
ReactNative
.
findNodeHandle
(
this
),
UIManager
.
AndroidViewPager
.
Commands
.
setPageWithoutAnimation
,
[
selectedPage
],
);
};
render
()
{
return
(
<
YH_ViewPagerView
{...
this
.
props
}
ref
=
{
VIEWPAGER_REF
}
style
=
{
this
.
props
.
style
}
onPageScroll
=
{
this
.
_onPageScroll
}
onPageScrollStateChanged
=
{
this
.
_onPageScrollStateChanged
}
onPageSelected
=
{
this
.
_onPageSelected
}
children
=
{
this
.
_childrenWithOverridenStyle
()}
/>
)
;
return
null
;
}
}
...
...
Please
register
or
login
to post a comment