pub package Awesome

This Flutter plugin aims to achive drop cap in text capitalization.

Usage

import 'package:drop_cap_text/drop_cap_text.dart';

DropCapText(
    loremIpsumText,
    style: TextStyle(fontStyle: FontStyle.italic),
),

ex1

Properties

Name Type Default Description
data String null
mode DropCapMode DropCapMode.inside aside, upwards, ..
textAlign TextAlign null
indentation Offset Offset.zero
dropCapChars int 1
dropCapPadding EdgeInsets EdgeInsets.zero
dropCap DropCap [Widget] null
style TextStyle null
dropCapStyle TextStyle
forceNoDescent bool false
parseInlineMarkdown bool false bold
dropCapPosition DropCapPosition DropCapPosition.start
textDirection TextDirection TextDirection.ltr
maxLines int
overflow TextOverflow TextOverflow.clip

Customization

Custom DropCap Widget: Image

ex3

DropCapText(
    loremIpsumText,
    dropCap: DropCap(
    width: 100,
    height: 100,
    child: Image.network(
    	'https://www.codemate.com/wp-content/uploads/2017/09/flutter-logo.png')
    ),
),
Custom DropCap Widget: Parse Inline Markdown

only supports italic bold underline

ex8

DropCapText(
  'Lorem ipsum **dolor sit amet, consectetur adipiscing elit, ++sed do eiusmod++ tempor incididunt** ut labore et _dolore magna aliqua_.',
  parseInlineMarkdown: true,
  dropCapStyle: TextStyle(fontSize: 100, fontWeight: FontWeight.bold, color: Colors.green),
  dropCapPadding: EdgeInsets.only(right: 19.0),
  style: TextStyle(fontSize: 18.0, height: 1.5),
),
Custom DropCap Widget: Image right + justification

ex7

DropCapText(
    loremIpsumText,
    dropCapPosition: DropCapPosition.end,
    textAlign: TextAlign.justify,
    dropCap: DropCap(
    width: 100,
    height: 100,
    child: Image.network(
    	'https://www.codemate.com/wp-content/uploads/2017/09/flutter-logo.png')
    ),
),
2 characters + indentation

ex2

DropCapText(
    loremIpsumText,
    style: TextStyle(
        height: 1.3,
        fontFamily: 'times',
    ),
    dropCapChars: 2,
    indentation: Offset(25, 10),
),
Upward drop cap

ex5

DropCapText(
    loremIpsumText,
    mode: DropCapMode.upwards,
    dropCapStyle: TextStyle(
        color: Colors.red,
        fontWeight: FontWeight.bold,
        fontSize: 120,
        fontFamily: 'times',
    ),
),
Aside drop cap

ex6

DropCapText(
    loremIpsumText,
    style: TextStyle(
        fontWeight: FontWeight.bold,
        height: 1.2,
    ),
    mode: DropCapMode.aside,
),

Libraries

drop_cap_text