패키지, 저장소 및 앱 카테고리 검색

social_embed_webview 표지
패키지 상세v0.3.2

social_embed_webview

플랫폼의 웹 임베드 기능을 사용하여 Flutter에서 소셜 미디어 게시물을 쉽게 삽입할 수 있는 위젯을 제공합니다.

AndroidiOS
30일 다운로드
27
좋아요
43
Pub 점수
120

패키지 설치

flutter pub add social_embed_webview

패키지 개요

공개 정보를 바탕으로 생성한 선택 가이드입니다.

social_embed_webview 패키지는 플러터 개발자가 플랫폼의 네이티브 웹 임베딩 기능을 사용하여 앱 내에 소셜 미디어 게시물을 쉽게 삽입할 수 있도록 도와줍니다. 이 패키지는 WebView 컴포넌트를 활용하여 트윗, 인스타그램 게시물 또는 페이스북 업데이트와 같은 소셜 콘텐츠를 앱 내에서 직접 렌더링하는 간단한 위젯을 제공합니다. 이 접근 방식은 동적 소셜 미디어 콘텐츠와의 호환성을 보장하면서 안드로이드 및 iOS 플랫폼에서 원활한 사용자 경험을 유지합니다. 소셜 피드나 공유 가능한 콘텐츠를 통합하는 앱에 적합합니다.

사용 사례

  • 뉴스 앱에 트윗 삽입하기
  • 소셜 피드에 인스타그램 게시물 표시
  • 커뮤니티 앱에서 페이스북 게시물 통합
  • 콘텐츠 플랫폼에서 YouTube 동영상 표시
  • 공유 가능한 소셜 콘텐츠 미리보기 만들기

주요 기능

  • 소셜 미디어 임베딩을 위한 간단한 위젯
  • 플랫폼 네이티브 웹 임베딩 사용
  • Android 및 iOS를 지원합니다
  • 경량이며 통합이 쉬움
  • 동적 소셜 미디어 콘텐츠 처리

적합한 대상

  • 소셜 미디어 통합 앱
  • 뉴스 및 콘텐츠 집약 플랫폼
  • 소셜 네트워킹 애플리케이션
  • 마케팅 및 프로모션 앱
  • 공유 가능한 미디어 미리보기 필요 앱

고려 사항

  • 인터넷 연결에 의존합니다
  • 웹 액세스를 위해 추가 권한이 필요할 수 있습니다
  • 성능은 네트워크 속도에 따라 달라집니다
  • 임베드 콘텐츠의 사용자 정의가 제한적
  • 외부 웹 콘텐츠와 관련된 보안 고려 사항

원본 README

연결된 소스 저장소의 README 원문 스냅샷입니다. 최신 내용은 저장소에서 확인하세요.

Social Embed WebView (Developers Preview)

Currently non of the major social media platform provides support to embed their post in a flutter app. This flutter package provides widgets to embed posts of various social media platforms using webview_flutter in the background.

Please note

  • version < 0.3.0 is not backward compatiable from this version. So please go through examples before upgrading

Content

Why Us

They are not many solutions in the community to solve this problem. All the packages use the same webview_flutter in the background but have a major issue of a predefined height. While this package adjusts the heights of the webview automatically according to the size of the embedded post.

Supported Platforms:

How to use?

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

dependencies:
  social_embed_webview: 0.3.1

2: You can install packages from the command line:

$ flutter packages get

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

3: Please visit webview_flutter and follow the steps required for implementations in Android and iOS respectively.

Example

Please make sure to remove <script>...</script> added by the platform with other embed code. Please visit examples for more detailed examples corresponding to each platform

import 'package:flutter/material.dart';
import 'package:social_embed_webview/platforms/twitter.dart';
import 'package:social_embed_webview/social_embed_webview.dart';

/// <srcipts>...</scripts> tag has been removed
String tweetContent = r"""
<blockquote class="twitter-tweet"><p lang="en" dir="ltr">Here’s an edit I did of one of my drawings. I tend to draw a lot of aot stuff when each chapter is released. Sorry about that!<br>Song: polnalyubvi кометы<br>Character: Annie Leonhart <a href="https://twitter.com/hashtag/annieleonhart?src=hash&amp;ref_src=twsrc%5Etfw">#annieleonhart</a> <a href="https://twitter.com/hashtag/aot131spoilers?src=hash&amp;ref_src=twsrc%5Etfw">#aot131spoilers</a> <a href="https://twitter.com/hashtag/aot?src=hash&amp;ref_src=twsrc%5Etfw">#aot</a> <a href="https://twitter.com/hashtag/AttackOnTitan131?src=hash&amp;ref_src=twsrc%5Etfw">#AttackOnTitan131</a> <a href="https://twitter.com/hashtag/AttackOnTitans?src=hash&amp;ref_src=twsrc%5Etfw">#AttackOnTitans</a> <a href="https://twitter.com/hashtag/snk?src=hash&amp;ref_src=twsrc%5Etfw">#snk</a> <a href="https://twitter.com/hashtag/snk131?src=hash&amp;ref_src=twsrc%5Etfw">#snk131</a> <a href="https://twitter.com/hashtag/shingekinokyojin?src=hash&amp;ref_src=twsrc%5Etfw">#shingekinokyojin</a> <a href="https://t.co/b4z48ruCoD">pic.twitter.com/b4z48ruCoD</a></p>&mdash; evie (@hazbin_freak22) <a href="https://twitter.com/hazbin_freak22/status/1291884358870142976?ref_src=twsrc%5Etfw">August 7, 2020</a></blockquote> """;

void main() {
  runApp(MyApp());
}

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

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: SafeArea(
        child: Scaffold(
          appBar: AppBar(
            title: const Text('Social Embed WebView Example'),
          ),
          body: SingleChildScrollView(
            child: Padding(
              padding: const EdgeInsets.all(8.0),
              child: Column(
                children: [
                  SocialEmbed(
                      socialMediaObj:
                          TwitterEmbedData(embedHtml: tweetContent)),
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }
}

Output

Known Bugs

  • Media playback continuous incase of router.push() for all platform
  • Media playback continuous incase of app going in background for all platform except Youtube

카테고리

의존성

의존성 목록 4 개

소스 저장소

이 패키지를 사용하는 프로젝트

아직 데이터가 없습니다.