flutter 如何用乌斯曼·塔哈的书法创作一部15行的《古兰经》?

piwo6bdm  于 2023-10-22  发布在  Flutter
关注(0)|答案(1)|浏览(100)

我想用数据库和604字体制作一部古兰经,但我无法制作线条
https://cdnquran.inoor.ir/fonts/moshaffonts/fonts.zip [https://aminsedghi.iapp.ir/moshaf4.dbenter图像说明在此](https://i.stack.imgur.com/bRG4p.jpg

import 'dart:ffi';
import 'dart:io';
import 'dart:typed_data';

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:path/path.dart';
import 'package:path_provider/path_provider.dart';
import 'package:sqflite_common_ffi/sqflite_ffi.dart';
import 'package:sqflite_common/sqlite_api.dart';

class Quran extends StatefulWidget {
  const Quran({Key? key});

  @override
  State<Quran> createState() => _QuranState();
}

class _QuranState extends State<Quran> {
  List<String> ayahs = [];

  double point = 100.0;

@override
void initState() {
  sql();
  super.initState();
}

void sql() async {
  sqfliteFfiInit();
  databaseFactory = databaseFactoryFfi;

  var documentsDirectory = await getApplicationDocumentsDirectory();
  var databasePath = '${documentsDirectory.path}/moshaf15.db';

  if (!(await File(databasePath).exists())) {
    ByteData data = await rootBundle.load('assets/db/moshaf15.db');
    List<int> bytes = data.buffer
        .asUint8List(data.offsetInBytes, data.lengthInBytes);
    await File(databasePath).writeAsBytes(bytes);
  }

  Database database = await openDatabase(databasePath);

  List<Map<String, dynamic>> result = await database.rawQuery(
    'SELECT * FROM glyph WHERE page_number = 264 ORDER BY line_number ASC',
  );

  for (var row in result) {
    String code = row['code'].toString();
    ayahs.add(code);
  }

  await database.close();
}
  @override
Widget build(BuildContext context) {
  double height = MediaQuery.of(context).size.height;
  double width = MediaQuery.of(context).size.width;
  double heightSunWidth = (height + width);

  return SafeArea(
    child: Scaffold(
      appBar: AppBar(
        title: Text(
          "بیت الاحزان",
          style: TextStyle(
            fontSize: heightSunWidth / 60,
            fontFamily: "Vazir-semibold",
          ),
        ),
        centerTitle: true,
        backgroundColor: Colors.green,
      ),
      body: ListView.builder(
        itemCount: (ayahs.length / 15).ceil(),
        itemBuilder: (context, index) {
          int startIndex = index * 15;
          int endIndex = startIndex + 15;
          List<String> subAyahs = ayahs.sublist(startIndex, endIndex);
          return Column(
            children: subAyahs.map((ayah) {
              return Text(
                String.fromCharCode(int.parse(ayah)),
                style: TextStyle(fontSize: 100, fontFamily: 'p264'),
              );
            }).toList(),
        bottomNavigationBar: BottomAppBar(
          clipBehavior: Clip.antiAlias,
          color: Colors.green,
          shape: CircularNotchedRectangle(),
          notchMargin: 5,
          height: 60,
          child: Row(
            mainAxisSize: MainAxisSize.max,
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              PointButton(heightSunWidth, "تپق", 0.5),
              PointButton(heightSunWidth, "اعراب", 1.5),
              PointButton(heightSunWidth, "کلمه", 3.0),
              SizedBox(
                width: width / 10,
              ),
              PointButton(heightSunWidth, "جمله", 4.0),
              PointButton(heightSunWidth, "سر آیه", 4.0),
              PointButton(heightSunWidth, "سر صفحه", 5.0),
            ],
          ),
        ),
        floatingActionButton: FloatingActionButton(
          onPressed: () {},
          backgroundColor: Colors.green,
          child: Icon(Icons.check),
        ),
        floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
      ),
    );
  }

  Widget PointButton(
    double hw,
    String title,
    double point,
  ) {
    return Expanded(
      child: InkWell(
        onTap: () {
          setState(() {
            this.point -= point;
          });
        },
        child: Container(
          child: Center(
            child: Text(
              title,
              style: TextStyle(
                fontFamily: "Vazir-regular",
                color: Colors.white,
              ),
            ),
          ),
        ),
      ),
    );
  }
}

我希望所有的网页(604)被拖动左右,就像上传的图像,他们都有15行在页面上移动。

qxgroojn

qxgroojn1#

所以让我们一个一个来解决,
对于有15行,你需要告诉你最多有15行,最好使用这个库auto_size_text
至于使用PageView可以实现的多个页面,它给予您正在查看的内容,您可以为动画编写自定义的Transformer。
最后,要实现自定义字体,您需要将该字体放入资产中,将其添加到pubspec中,然后使用字体家族名称更改文本样式

import 'package:flutter/material.dart';

/// Flutter code sample for [PageView].

void main() => runApp(const PageViewExampleApp());

class PageViewExampleApp extends StatelessWidget {
  const PageViewExampleApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: const Text('PageView Sample')),
        body: const PageViewExample(),
      ),
    );
  }
}

class PageViewExample extends StatelessWidget {
  const PageViewExample({super.key});

  @override
  Widget build(BuildContext context) {
    final PageController controller = PageController();
    return PageView(
      /// [PageView.scrollDirection] defaults to [Axis.horizontal].
      /// Use [Axis.vertical] to scroll vertically.
      controller: controller,
      children: const <Widget>[
        Center(
          child: AutoSizeText(
          'Long Text Here',
          style: TextStyle(fontSize: 20),
          maxLines: 15,
           )
        ),
        Center(
          child: Text('Second Page'),
        ),
        Center(
          child: Text('Third Page'),
        ),
      ],
    );
  }
}

相关问题