pyozer / dots_indicator Goto Github PK

To me it makes sense that both 'dotCount' and 'position' should be int ('dotCount' is the number of dots, and 'position' is the index of the current dot). Why is 'position' a double? What does it mean for position to be 1.5?

not all the case super coders are using ur plugins,consider newbies too,pls attactch a simple example

dots_indicator 2.0.0
When there are too many page numbers.

log:

The following assertion was thrown during layout:
A RenderFlex overflowed by 144 pixels on the right.

How to make an indefinite indicator like https://github.com/wching/Android-Indefinite-Pager-Indicator with this library ?

Hi,

I am getting error as:
'package:dots_indicator/src/dots_indicator.dart': Failed assertion: line 31 pos 16: 'dotsCount != null && dotsCount > 0': is not true.

In init state part I am getting a data from remote server. Once the data verify I set the loadIndicator true so I can show the page. in area that data verify before setting the page loadIndicator to true in setState I set the pageLength. pageLength is integer and it totals of list of the data that I get from database. Everything works. Even I set the dotsCount = pageLength;

Any idea why I am keep getting this error?

My code:

return Scaffold(
    body: new Form(
      key: _formKey,
      child: Stack(
        children: [
          Column(
            children: [
              // IMAGE AREA TOP
              Container(
                height: 230.0,
                width: MediaQuery.of(context).size.width - 50.0,
                child: PageView.builder(
                  scrollDirection: Axis.horizontal,
                  controller: _pageController,
                  onPageChanged: ((_page) {
                    setState(() {
                      int _currentValue = int.parse('$_page');
                      currentIndexPage = _currentValue;
                    });
                  }),
                  itemCount: pageLength,
                  itemBuilder: (context, index) => _creditCard(context, currentIndexPage),
                ),
              ),
              // DOTS INDICTOR AREA
              Padding(
                padding: const EdgeInsets.only(top: 16.0),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    DotsIndicator(
                      dotsCount: pageLength,
                      position: double.parse('$currentIndexPage'),
                      decorator: DotsDecorator(
                        color: Colors.black38,
                        activeColor: Colors.red,
                        size: const Size.square(9.0),
                        activeSize: const Size(18.0, 9.0),
                        activeShape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(5.0)),
                      ),
                    )
                  ],
                ),
              ),

flutter doctor -v:

[✓] Flutter (Channel stable, 1.22.6, on macOS 11.2.2 20D80 darwin-x64, locale en-GB)
    • Flutter version 1.22.6 at /Users/*********/flutter
    • Framework revision 9b2d32b605 (6 weeks ago), 2021-01-22 14:36:39 -0800
    • Engine revision 2f0af37152
    • Dart version 2.10.5

[✓] Android toolchain - develop for Android devices (Android SDK version 30.0.3)
    • Android SDK at /Users/*********/Library/Android/sdk
    • Platform android-30, build-tools 30.0.3
    • ANDROID_HOME = /Users/*********/Library/Android/sdk
    • Java binary at: /Applications/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b3-6915495)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 12.4)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Xcode 12.4, Build version 12D4e
    • CocoaPods version 1.10.1

[✓] Android Studio (version 4.1)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin installed
    • Dart plugin version 201.9335
    • Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b3-6915495)

[✓] IntelliJ IDEA Community Edition (version 2020.3.2)
    • IntelliJ at /Applications/IntelliJ IDEA CE.app
    • Flutter plugin installed
    • Dart plugin version 203.6912

[✓] Connected device (1 available)
    • iPhone 11 (mobile) • 92E3**************************************E72 • ios • com.apple.CoreSimulator.SimRuntime.iOS-14-4 (simulator)

Hey Thanks for the awesome package. This made my job very easy. However the direction property is missing. I would like to use a vertical indicator rather horizontal. Do you have plans to upgrade the plugin anytime soon?

Latest change (position to int) is a breaking change and as such can break other (library) packages which depend on dots_inidicator.

Would it be possible to pull the latest version and re-release it as a breaking change (3.0.0)?

Hi there ! Just wondering if there is functionality to change the color of the inactive dots. I did not see it explicitly and it's very possible I overlooked something!

Letting you know because, we don't like to use same color code again and again.

Hi! Great library, thanks for writing it.

I wrote a wrapper to integrate these indicators with flutter's built-in PageController. I'm posting it here in case it's a useful addition. Feel free to assign me a PR if this should be integrated with DotsIndicator, or close this ticket if it's out of scope.

What this does:

1. registers itself with PageController.addListener so it receives updates
2. connects DotsIndicator.onTap to the PageController so taps update the PageView position

class ListenerDots extends StatefulWidget {
  final PageController pos;
  final int dotsCount;
  const ListenerDots({Key? key, required this.pos, required this.dotsCount})
      : super(key: key);

  @override
  State<StatefulWidget> createState() => _ListenerDotsState();
}

class _ListenerDotsState extends State<ListenerDots> {
  double lastPos = 0;

  @override
  void initState() {
    widget.pos.addListener(updatePage);
    super.initState();
  }

  /// listen handler
  updatePage() => setState(() {
        lastPos = widget.pos.page ?? 0.0;
      });

  @override
  void dispose() {
    widget.pos.removeListener(updatePage);
    super.dispose();
  }

  onTap(double offset) {
    widget.pos.animateToPage(
      offset.toInt(),
      duration: const Duration(milliseconds: 200),
      curve: Curves.easeInOut,
    );
  }

  @override
  Widget build(BuildContext context) => DotsIndicator(
      dotsCount: widget.dotsCount, position: lastPos, onTap: onTap);
}

It seems the widget is taking all page width and is left centered.

How to center this DotIndicator widget ?

The plugin is working perfectly for the mobile app (Android / iOS)

When I try to use this plugin with flutter web it works fine except when I try to resize the window.
When I resize the window, more points are added to the dots indicator and an overflow appear on the right.

Error:

The relevant error-causing widget was:
Row org-dartlang-app:///packages/dots_indicator/src/dots_indicator.dart:61:11
The overflowing RenderFlex has an orientation of Axis.horizontal.
The edge of the RenderFlex that is overflowing has been marked in the rendering with a yellow and black striped pattern. This is usually caused by the contents being too big for the RenderFlex.

Consider applying a flex factor (e.g. using an Expanded widget) to force the children of the RenderFlex to fit within the available space instead of being sized to their natural size.
This is considered an error condition because it indicates that there is content that cannot be seen. If the content is legitimately bigger than the available space, consider clipping it with a ClipRect widget before putting it in the flex, or using a scrollable container rather than a Flex, like a ListView.

Hi,

I noticed that ColorLoader is not well centered. Reason is that only the right padding is added in the _ColorLoaderState build function, so dots are shifted left as a result.
It can be fixed if padding for dots is set in following order:

padding: const EdgeInsets.only(left: 4.0, right: 8.0)
padding: const EdgeInsets.only(right: 8.0)
padding: const EdgeInsets.only(right: 4.0)

I guess since it is a small fix I post it here..but if you want I can send a pull request too.

Cheers,
Milos

Good morning everyone.
I want to manage that the points are dynamic that the activated and the not activated, are long according to the number of pages it has, is it possible?
I attach a picture

https://ibb.co/wM7Nysv

I have a Pageview widget setup along with dots indicator. When the page changes the "position" of the dot also changes. So the dot transition happens immediately even before the page transition completes. A "delay" property would be great to keep both dot and the page transitions in sync.