순서

1. People 클래스 생성

2. List로 임의의 데이터 출력

3. 임의의 데이터 클릭 했을 때 공유창 띄우기

3-1. 의존성 추가하기

3-2. share 함수 구성하기


People 클래스 생성

import 'package:flutter/material.dart';

class People {
  final String name;
  final String description;

  People({@required this.name, @required this.description});
}


List로 임의의 데이터 출력

main.dart 밑에 HomePage라는 클래스를 StatelessWidget으로 만들어주자. 그리고 build 함수에는 Scaffold를 리턴하여 기본적인 appBar와 body를 만들어 봅니다.

import 'package:flutter/material.dart';
import 'package:fluttershared/People.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: HomePage(),
    );
  }
}

class HomePage extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(title: Text("공유기능 앱"),),

        body: ,
     );
  }

}


이제 기본적인 와꾸가 만들어 졌으면 아까 생성한 클래스로 3개 정도의 데이터를 만들고 Column 위젯으로 나열해보자!

class HomePage extends StatelessWidget {

  List<People> peoples = [
    People(name: "이순신", description: "장군22"),
    People(name: "세종대왕", description: "대왕"),
    People(name: "홍길동", description: "의적")
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(title: Text("공유기능 앱"),),

        body: Column(
            children: peoples
                .map((People people) => Card(
              child: ListTile(
                title: Text(people.name),
                subtitle: Text(people.description),
                onTap: (){},
              ),
            ))
                .toList()
        ));
  }
}


여기까지 잘 따라왔다면 아래와 같은 화면이 출력되야 한다.

/assets/post-img/flutter/share/1.png

이제 onTap에 터치 했을 때 공유할 수 있도록 기능을 넣어보자.


의존성 추가하기

pubspec.yaml 파일을 열어 아래와 같이 의존성을 추가하고 plug get을 하자.

dependencies:
  flutter:
    sdk: flutter
  share: ^0.6.2+3


share 함수 구성하기

import 'package:share/share.dart';

class HomePage extends StatelessWidget {

  List<People> peoples = [
    People(name: "이순신", description: "장군"),
    People(name: "세종대왕", description: "대왕"),
    People(name: "홍길동", description: "의적")
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(title: Text("공유기능 앱"),),

      body: Column(
        children: peoples
          .map((People people) => Card(
            child: ListTile(
              title: Text(people.name),
              subtitle: Text(people.description),
              onTap: () => share(context, people),
            ),
        ))
        .toList()
    ));
  }

  void share(BuildContext context, People people){
    final RenderBox box = context.findRenderObject();
    final String text = "${people.name} - ${people.description}";

    Share.share(text, subject: people.description,
    sharePositionOrigin: box.localToGlobal(Offset.zero) & box.size);
  }

}

필요한 일부만 발퀘해서 작성하였다. 이런식으로 사용하면 공유 기능을 사용할 수 있다. 짝짝짝!

출처 : https://www.youtube.com/watch?v=K2HXYGVOTRY