https://github.com/hamed-rezaee/flutter_3d_rendering

A sample Flutter project to demonstrate 3D rendering.
https://github.com/hamed-rezaee/flutter_3d_rendering

3d-cube 3d-donut 3d-rendering custom-painter flutter

Last synced: 11 months ago
JSON representation

A sample Flutter project to demonstrate 3D rendering.

• Host: GitHub
• URL: https://github.com/hamed-rezaee/flutter_3d_rendering
• Owner: hamed-rezaee
• License: mit
• Created: 2023-09-02T01:22:50.000Z (almost 3 years ago)
• Default Branch: master
• Last Pushed: 2023-09-24T01:07:51.000Z (over 2 years ago)
• Last Synced: 2023-11-04T02:29:14.951Z (over 2 years ago)
• Topics: 3d-cube, 3d-donut, 3d-rendering, custom-painter, flutter
• Language: C++
• Homepage:
• Size: 14.6 MB
• Stars: 4
• Watchers: 1
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# Flutter 3D Rendering

![Cube Renderer](cube_renderer_line.gif)

![Donut Line Renderer](donut_renderer_line.gif)

![Donut Point Renderer](donut_renderer_point.gif)

![Render Painter](renderer.gif)

This Flutter application provides a simple example of 3D rendering using custom painting. It renders a rotating 3D object on the screen.

Inspired by Coding Train's [Coding Challenge #112: 3D Rendering with Rotation and Projection](https://www.youtube.com/watch?v=p4Iz0XJY-Qk) by Daniel Shiffman.

## Usage

Import the package in your Dart code:

```dart

import 'package:flutter_3d_rendering/donut_renderer.dart';

import 'package:flutter_3d_rendering/render_painter.dart';

```

Create a `BaseRenderer` with an angleX, angleY, angleZ to control rotation:

```dart

final renderer = DonutRenderer(

  angleX: angleX,

  angleY: angleY,

  angleZ: angleZ,

);

```

In your widget's `build` method, use the `CustomPaint` widget to display the object:

```dart

CustomPaint(

  size: const Size(400, 400),

  painter: RenderPainter(renderer),

)

```

To continuously rotate the object, you can use a timer or any other mechanism to update the angle over time. Here's an example using a timer:

```dart

Timer.periodic(const Duration(milliseconds: 16), (timer) {

  setState(() {

    angleX += 0.01;

    angleY += 0.01;

    angleZ += 0.01;

  });

});

```

## Matrix Helper and Vector

The package includes a `matrix_helper`.dart file that provides matrix manipulation functions for 3D transformations. Additionally, it includes a `vector.dart` file for working with 3D vectors.

## License

This package is released under the MIT License. See the [LICENSE](LICENSE) file for details.