|
1 | | -## Getting started |
| 1 | +# Flutter on Rails |
2 | 2 |
|
3 | | -Coming soon |
| 3 | + |
4 | 4 |
|
| 5 | +A powerful integration between Flutter and Ruby on Rails that enables seamless communication between web and mobile applications. |
5 | 6 |
|
| 7 | + |
6 | 8 |
|
7 | | -<!-- Android displays the "cleartext HTTP traffic not permitted" error because it defaults to preventing apps from using unencrypted, cleartext HTTP connections, especially for apps targeting API level 28 or higher. This is a security measure to protect sensitive data from being intercepted. |
| 9 | +## Features |
| 10 | + |
| 11 | +- 🔄 **Bi-directional Communication**: Seamless communication between Flutter and Rails |
| 12 | +- 📱 **Cross-Platform**: Works on iOS, Android, and desktop |
| 13 | +- 🎨 **Customizable UI**: Platform-specific dialogs,navigation and animations |
| 14 | +- 🔌 **Easy Integration**: Simple setup and configuration |
| 15 | +- 🚀 **Performance Optimized**: Efficient WebView handling and state management |
| 16 | + |
| 17 | +## Installation |
| 18 | + |
| 19 | +Add the package to your `pubspec.yaml`: |
| 20 | + |
| 21 | +```yaml |
| 22 | +dependencies: |
| 23 | + flutter_on_rails: ^0.0.3.alpha |
| 24 | +``` |
| 25 | +
|
| 26 | +## Quick Start |
| 27 | +
|
| 28 | +1. Initialize the WebView in your Flutter app: |
| 29 | +
|
| 30 | +```dart |
| 31 | +import 'package:flutter/material.dart'; |
| 32 | +import 'package:flutter_on_rails/flutter_on_rails.dart'; |
| 33 | + |
| 34 | +void main() async { |
| 35 | + WidgetsFlutterBinding.ensureInitialized(); |
| 36 | + await init(); |
| 37 | + runApp(MaterialApp(home: MainScreen())); |
| 38 | +} |
| 39 | +``` |
| 40 | + |
| 41 | +2. Add navigation attributes to your Rails views: |
| 42 | + |
| 43 | +```html |
| 44 | +<a |
| 45 | + href="/messages/new" |
| 46 | + data_frails_navigation='{"action":"push", "navigable":true, "animate":"circularReveal","backgroundColor": "#111827","leadingColor": "#111827","title": "Message" }' |
| 47 | + >New Message</a |
| 48 | +> |
| 49 | +``` |
| 50 | + |
| 51 | +### Dialog Animations |
| 52 | + |
| 53 | +```dart |
| 54 | +DialogAnimation.openDialog( |
| 55 | + context, |
| 56 | + { |
| 57 | + 'title': 'Custom Dialog', |
| 58 | + 'content': 'This is a test message', |
| 59 | + 'animate': 'scale', // Available options: none, rotate, scale, right, left, downToUp, topToDown |
| 60 | + 'actions': [ |
| 61 | + { |
| 62 | + 'text': 'OK', |
| 63 | + 'onPressed': () => print('OK pressed') |
| 64 | + } |
| 65 | + ] |
| 66 | + }, |
| 67 | +); |
| 68 | +``` |
| 69 | + |
| 70 | +## API Reference |
| 71 | + |
| 72 | +### Navigation |
| 73 | + |
| 74 | +- `data-frails-navigation`: Attribute for handling navigation in Rails views |
| 75 | +- `data-frails-action`: Attribute for custom actions |
| 76 | + |
| 77 | +### Dialog Options |
| 78 | + |
| 79 | +```dart |
| 80 | +{ |
| 81 | + 'title': String, // Dialog title |
| 82 | + 'content': String, // Dialog content |
| 83 | + 'animate': String, // Animation type |
| 84 | + 'actions': List<Map>, // Dialog actions |
| 85 | + 'backgroundColor': Color, // Dialog background color |
| 86 | + 'elevation': double, // Dialog elevation |
| 87 | + 'shape': ShapeBorder, // Dialog shape |
| 88 | + 'borderRadius': double, // Dialog border radius |
| 89 | + 'titlePadding': EdgeInsets,// Title padding |
| 90 | + 'contentPadding': EdgeInsets,// Content padding |
| 91 | + 'actionsPadding': EdgeInsets,// Actions padding |
| 92 | + 'buttonPadding': EdgeInsets,// Button padding |
| 93 | + 'insetPadding': EdgeInsets,// Dialog inset padding |
| 94 | +} |
| 95 | +``` |
| 96 | + |
| 97 | +## Platform-Specific Features |
| 98 | + |
| 99 | +### iOS |
| 100 | + |
| 101 | +- Custom keyboard handling |
| 102 | +- Native dialog support |
| 103 | +- Gesture navigation |
| 104 | +- Pull-to-refresh functionality |
| 105 | + |
| 106 | +### Android |
| 107 | + |
| 108 | +- Custom WebView settings |
| 109 | +- Native dialog support |
| 110 | +- Pull-to-refresh functionality |
| 111 | + |
| 112 | +## Contributing |
| 113 | + |
| 114 | +1. Fork the repository |
| 115 | +2. Create your feature branch (`git checkout -b feature/amazing-feature`) |
| 116 | +3. Commit your changes (`git commit -m 'Add some amazing feature'`) |
| 117 | +4. Push to the branch (`git push origin feature/amazing-feature`) |
| 118 | +5. Open a Pull Request |
| 119 | + |
| 120 | +## License |
| 121 | + |
| 122 | +This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details. |
| 123 | + |
| 124 | +## Support |
| 125 | + |
| 126 | +For support, email [email protected] or join our Slack channel. |
| 127 | + |
| 128 | +## Acknowledgments |
| 129 | + |
| 130 | +- Flutter team for the amazing framework |
| 131 | +- Ruby on Rails community |
| 132 | +- All contributors who have helped shape this project |
| 133 | + |
| 134 | +--- |
| 135 | + |
| 136 | +Made with ❤️ by [Adam Moussa Ali] |
| 137 | + |
| 138 | +<!-- Android displays the "cleartext HTTP traffic not permitted" error because it defaults to preventing apps from using unencrypted, cleartext HTTP connections, especially for apps targeting API level 28 or higher. This is a security measure to protect sensitive data from being intercepted. |
8 | 139 | Here's a more detailed explanation: |
9 | 140 | Security: |
10 | | -Android prioritizes data security by default. Using HTTP (which is not encrypted) can expose data to eavesdropping, especially over public Wi-Fi networks. |
| 141 | +Android prioritizes data security by default. Using HTTP (which is not encrypted) can expose data to eavesdropping, especially over public Wi-Fi networks. |
11 | 142 | API Level 28 and Above: |
12 | | -Apps targeting API level 28 or higher (Android 9 Pie and later) are automatically configured to disallow cleartext traffic. |
| 143 | +Apps targeting API level 28 or higher (Android 9 Pie and later) are automatically configured to disallow cleartext traffic. |
13 | 144 | Using usesCleartextTraffic: |
14 | | -If your app needs to use cleartext HTTP, you can enable it by adding the android:usesCleartextTraffic="true" attribute to the <application> tag in your AndroidManifest.xml file, or by explicitly configuring it in a network_security_config.xml file. |
| 145 | +If your app needs to use cleartext HTTP, you can enable it by adding the android:usesCleartextTraffic="true" attribute to the <application> tag in your AndroidManifest.xml file, or by explicitly configuring it in a network_security_config.xml file. |
15 | 146 | Alternatives: |
16 | | -Whenever possible, it's recommended to use HTTPS, which encrypts the communication and provides a secure channe --> |
| 147 | +Whenever possible, it's recommended to use HTTPS, which encrypts the communication and provides a secure channe --> |
0 commit comments