Giter VIP home page Giter VIP logo

fluttercandies / flutter_tilt Goto Github PK

View Code? Open in Web Editor NEW
113.0 4.0 4.0 39.61 MB

👀 Easily apply tilt parallax hover effects for Flutter, which supports tilt, light, shadow effects, and gyroscope sensors | 为 Flutter 轻松创建倾斜视差悬停效果,支持倾斜、光照、阴影效果和陀螺仪传感器

Home Page: https://pub.dev/packages/flutter_tilt

License: MIT License

Dart 100.00%
flutter hover parallax tilt animation flutter-package sensors widget

flutter_tilt's People

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar

flutter_tilt's Issues

Tapping Moves Entire Content

When I set enableRevert & enableSensorRevert to false,

How to reproduce
run the example app

Steps to reproduce the behavior:

  1. set enableRevert & enableSensorRevert to false
  2. tap on counter widget or FAB
  3. see the content tilt and the FAB gets moved away from your finger

Expected behavior
I want the FAB to be able to move around and be tappable without moving or moving the content. so it can move independently and still interact.
i do want to be able to move the counter widget by panning around. maybe have a "disable" control option or something?

maybe this is just a limitation of the example. perhaps some other use case examples would be beneficial. there are a ton of use cases such as revealing hidden content, panning content around, and dropping a ball into a hole (target)

iPhone 12

[Bug report] Black bars when using in mobile browser.

Version

3.0.1

Platforms

Web - Only in mobile browser

Device Model

Samsung Galaxy S22 Ultra

Flutter info

[✓] Flutter (Channel stable, 3.19.5, on macOS 14.4.1 23E224 darwin-arm64, locale en-US)
    • Flutter version 3.19.5 on channel stable at /Users/firdous.ismail/development/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 300451adae (3 weeks ago), 2024-03-27 21:54:07 -0500
    • Engine revision e76c956498
    • Dart version 3.3.3
    • DevTools version 2.31.1

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    • Android SDK at /Users/firdous.ismail/Library/Android/sdk
    • Platform android-34, build-tools 34.0.0
    • Java binary at: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 17.0.9+0-17.0.9b1087.7-11185874)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 15.3)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 15E204a
    • CocoaPods version 1.15.2

[✗] Chrome - develop for the web (Cannot find Chrome executable at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome)
    ! Cannot find Chrome. Try setting CHROME_EXECUTABLE to a Chrome executable.

[✓] Android Studio (version 2023.2)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 17.0.9+0-17.0.9b1087.7-11185874)

[✓] VS Code (version 1.88.1)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.86.0

[✓] Connected device (2 available)
    • sdk gphone64 arm64 (mobile) • emulator-5554 • android-arm64 • Android 13 (API 33) (emulator)
    • macOS (desktop)             • macos         • darwin-arm64  • macOS 14.4.1 23E224 darwin-arm64

[✓] Network resources
    • All expected network resources are available.

! Doctor found issues in 1 category.

How to reproduce?

The app is essentially unusable when the Tilt widget is active and running on any mobile browser, although it functions properly when tested on a desktop browser. For the first two Tilt widgets, all I can see are black bars, and below them, another card with a Tilt widget appears washed out. Moreover, none of the other widgets are visible. I tested on Edge mobile browser, and Samsung browser. I deployed using Firebase hosting, you can also test it yourself with below URL. I'll attach screenshots below.

Hosted using Firebase hosting here
https://firdous.web.app

Mobile browser screenshot
image

Desktop browser screenshot (In inspect mode)
image

Minimal example code (optional)

Tilt(
  tiltConfig: const TiltConfig(angle: 12.0, enableGestureSensors: false),
  shadowConfig: ShadowConfig(disable: !shadow),
  borderRadius: BorderRadius.circular(radius),
  child: child,
);

I must say, it's a fantastic and incredibly helpful package. Thanks in advance.

[Feature request] Need to set tilt programmatically.

Platforms

Android, iOS

Description

Hi, Thank you for your awesome plugin. That's amazing animation.
However, I need to know Can I set tilt by not from user interaction? but from code to animate widget.

Thank in advanced.

Why

In case need to animate ifself for interval duration to tilt widget over and over again.
Also, Can we add depth to make it look like it has more dimension?

Tilt & Hold Position? Or Tilt to Pan?

Hi, wondering if it's possible that when you tilt and keep it tilted that the position stays until you tilt it back to origin? This could be fun to be able to peek behind things or pan around a widget.

It has been implemented on the Motion Package
mrcendre/motion#8

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo 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.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.