Search packages, repositories and app categories

ducafecatFlutter ecosystem guide
Package detailsv1.2.1

link_previewer

A new Flutter package. It is build for making link looks prettier than just inline link or default hyperlink.

pub.dev API documentation Source code
30-day downloads
59
Likes
14
Pub points
40

Install package

flutter pub add link_previewer

Package Overview

Package selection guidance compiled from public package information, community data, and project usage.

Link Previewer is a Flutter package designed to enhance the visual presentation of links within apps. It transforms plain URLs into rich, interactive previews with thumbnails, titles, descriptions, and metadata fetched from the linked content. Ideal for social media applications, messaging platforms, or any app where users share web links, it improves user engagement by making links more informative and visually appealing. The package supports dynamic rendering and integrates seamlessly with existing text widgets.

Use cases

  • Social media apps
  • Messaging interfaces
  • Content sharing features
  • Blog or news feed displays
  • User-generated content platforms

Key features

  • Auto-fetches link metadata
  • Displays thumbnails and descriptions
  • Supports dynamic preview rendering
  • Easy integration with Text widgets
  • Clean, customizable UI

Suitable for

  • Developers building social apps
  • Apps with user-shared links
  • Projects needing rich link visualization
  • Teams focused on UX improvements

Considerations

  • Requires internet access for metadata fetching
  • May impact performance with many previews
  • Limited to HTTP/HTTPS URLs
  • No offline preview support
  • Depends on external site's meta tags

Original README

Original README snapshot from the linked source repository. Visit the repository for the latest content.

link_previewer

A new Flutter package. Build container with image, title, description from web-site (link) will be provided.

Getting Started

alt text

Installing

Use this package as a library

  1. Depend on it

Add this to your package's pubspec.yaml file:

dependencies:
  link_previewer: ^1.2.1
  1. Install it

You can install packages from the command line: with Flutter:

$ flutter pub get

Alternatively, your editor might support flutter pub get. Check the docs for your editor to learn more.

  1. Import it

Now in your Dart code, you can use:

import 'package:link_previewer/link_previewer.dart';

Usage

Widget build() {
  return Column(
    mainAxisAlignment: MainAxisAlignment.center,
    children: <Widget>[
      LinkPreviewer(
        link: "https://www.linkedin.com/feed/",
        direction: ContentDirection.horizontal,
      ),
      LinkPreviewer(
        link: "https://www.linkedin.com/feed/",
        direction: ContentDirection.vertical,
      ),
    ],
  );
}

Properties (Constructor props)

PropName Value Definition
link String value (Ex: "http://...") Link to website will be shown as LinkPreviewer
titleFontSize double (default: 15, but it's auto resizable depends on layout(parent) width or hight) Title font size
bodyFontSize double (default: 14, but it's auto resizable depends on layout(parent) width or hight) Body font size
backgroundColor Color (default: Colors.white) Background color in case there will be not much text and will be whitespace
borderColor Color (default: Colors.deepOrangeAccent) Border color of the previewer
borderRadius double (default: 3.0) Border radius
direction ContentDirection from the package (default: ContentDirection.horizontal) Options: 1. ContentDirection.horizontal 2. ContentDirection.vertical Content direction (image -> title -> body)
From version 1.1.0
PropName Value Definition
placeholder Widget Custom placeholder while data is loading
defaultPlaceholderColor Color (default: light-grey) If placeholder is not set, will be used the default one and its color can be set using this prop (empty container with background)
showTitle bool (default: true) Title can be hiden using this prop, if it set to false
showBody bool (default: true) Body can be hiden using this prop, if it set to false
From version 1.2.0
PropName Value Definition
bodyTextOverflow TextOverflow (default: TextOverflow.ellipsis or TextOverflow.fade) Text overflow prop
bodyMaxLines int (default: depends on hight) Max Lines that will be shown in the body

Categories

Social Media

Dependencies

Dependency list 4 items

Source repository

Projects using this package

No data available yet.