Comments (4)
请描述详细一些
from flutter-infinitecards.
_controller = InfiniteCardsController(
itemBuilder: _renderItem,
itemCount: 5,
animType: AnimType.SWITCH,
zIndexTransformCommon: _defaultCommonZIndexTransform,
zIndexTransformToBack: _defaultToFrontZIndexTransform,
zIndexTransformToFront: _defaultToFrontZIndexTransform,
);
_renderItem创建子控件时,当前界面有一个全局属性控制子控件一个图片的展示,我setState属性后界面没有刷新
from flutter-infinitecards.
这个是测试代码
import 'dart:math' as math;
import 'package:flutter/material.dart';
import 'package:infinite_cards/infinite_cards.dart';
import 'package:infinite_cards/src/card_item.dart';
class Home extends StatefulWidget {
@OverRide
_HomeState createState() => _HomeState();
}
class _HomeState extends State {
InfiniteCardsController _controller;
bool _isTypeSwitch = true;
@OverRide
void initState() {
super.initState();
_controller = InfiniteCardsController(
itemBuilder: _renderItem,
itemCount: 5,
animType: AnimType.SWITCH,
zIndexTransformCommon: _defaultCommonZIndexTransform,
zIndexTransformToBack: _defaultToFrontZIndexTransform,
zIndexTransformToFront: _defaultToFrontZIndexTransform,
);
}
void _defaultCommonZIndexTransform(CardItem card, double fraction, double curveFraction, double cardWidth, double cardHeight, int fromPosition, int toPosition) {
print(fraction.toString() + " " + cardWidth.toString() + " " + cardHeight.toString() + " " + fromPosition.toString() + " " + toPosition.toString() + " ");
card.zIndex = 1 + 0.01 * fromPosition + 0.01 * (toPosition - fromPosition) * fraction;
}
void _defaultToFrontZIndexTransform(CardItem card, double fraction, double curveFraction, double cardWidth, double cardHeight, int fromPosition, int toPosition) {
card.zIndex = 1;
print(fraction.toString() + " " + cardWidth.toString() + " " + cardHeight.toString() + " " + fromPosition.toString() + " " + toPosition.toString() + " ");
// if (fraction < 0.5) {
// card.zIndex = 1 + 0.01 * fromPosition;
// } else {
// card.zIndex = 1 + 0.01 * toPosition;
// }
}
Widget _renderItem(BuildContext context, int index) {
return Column(
children: [
Image(
image: AssetImage('assets/pic${index + 1}.png'),
),
Text(_index.toString()),
],
);
}
int _index = 0;
void _changeType(BuildContext context) {
if (_isTypeSwitch) {
_controller.reset(
itemCount: 4,
animType: AnimType.TO_FRONT,
transformToBack: _customToBackTransform,
);
} else {
_controller.reset(
itemCount: 5,
animType: AnimType.SWITCH,
transformToBack: DefaultToBackTransform,
);
}
_isTypeSwitch = !_isTypeSwitch;
}
@OverRide
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("InfiniteCards"),
),
body: Column(
children: [
InfiniteCards(
width: MediaQuery.of(context).size.width,
height: MediaQuery.of(context).size.width * 1.3,
controller: _controller,
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
RaisedButton(
onPressed: () {
_controller.reset(animType: _isTypeSwitch ? AnimType.SWITCH : AnimType.TO_FRONT);
_controller.previous();
},
child: Text("Pre"),
),
RaisedButton(
onPressed: () {
setState(() {
_index++;
});
// _changeType(context);
},
child: Text("Update"),
),
RaisedButton(
onPressed: () {
_controller.reset(animType: AnimType.TO_END);
_controller.next();
},
child: Text("Next"),
),
],
),
],
),
);
}
}
Transform _customToBackTransform(Widget item, double fraction, double curveFraction, double cardHeight, double cardWidth, int fromPosition, int toPosition) {
int positionCount = fromPosition - toPosition;
double scale = (0.8 - 0.1 * fromPosition) + (0.1 * fraction * positionCount);
double rotateY;
double translationX;
if (fraction < 0.5) {
translationX = cardWidth * fraction * 1.5;
rotateY = math.pi / 2 * fraction;
} else {
translationX = cardWidth * 1.5 * (1 - fraction);
rotateY = math.pi / 2 * (1 - fraction);
}
double interpolatorScale = 0.8 - 0.1 * fromPosition + (0.1 * curveFraction * positionCount);
double translationY = -cardHeight * (0.8 - interpolatorScale) * 0.5 - cardHeight * (0.02 * fromPosition - 0.02 * curveFraction * positionCount);
return Transform.translate(
offset: Offset(translationX, translationY),
child: Transform.scale(
scale: scale,
child: Transform(
transform: Matrix4.identity()
..setEntry(3, 2, 0.002)
..rotateY(rotateY),
alignment: Alignment.center,
child: item,
),
),
);
}
from flutter-infinitecards.
尝试给item添加key
from flutter-infinitecards.
Related Issues (3)
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from flutter-infinitecards.