Make images in community, instance, markdown fullscreenable

This commit is contained in:
krawieck 2020-09-11 20:38:50 +02:00
parent 1746cc0db5
commit 0f8a846e8a
4 changed files with 38 additions and 28 deletions

View File

@ -13,6 +13,7 @@ import '../util/intl.dart';
import '../util/text_color.dart'; import '../util/text_color.dart';
import '../widgets/badge.dart'; import '../widgets/badge.dart';
import '../widgets/bottom_modal.dart'; import '../widgets/bottom_modal.dart';
import '../widgets/fullscreenable_image.dart';
import '../widgets/markdown_text.dart'; import '../widgets/markdown_text.dart';
class CommunityPage extends HookWidget { class CommunityPage extends HookWidget {
@ -251,14 +252,17 @@ class _CommunityOverview extends StatelessWidget {
Container( Container(
width: 83, width: 83,
height: 83, height: 83,
child: CachedNetworkImage( child: FullscreenableImage(
imageUrl: community.icon, url: community.icon,
imageBuilder: (context, imageProvider) => Container( child: CachedNetworkImage(
decoration: BoxDecoration( imageUrl: community.icon,
shape: BoxShape.circle, imageBuilder: (context, imageProvider) => Container(
image: DecorationImage( decoration: BoxDecoration(
fit: BoxFit.cover, shape: BoxShape.circle,
image: imageProvider, image: DecorationImage(
fit: BoxFit.cover,
image: imageProvider,
),
), ),
), ),
), ),

View File

@ -11,6 +11,7 @@ import '../util/goto.dart';
import '../util/text_color.dart'; import '../util/text_color.dart';
import '../widgets/badge.dart'; import '../widgets/badge.dart';
import '../widgets/bottom_modal.dart'; import '../widgets/bottom_modal.dart';
import '../widgets/fullscreenable_image.dart';
import '../widgets/markdown_text.dart'; import '../widgets/markdown_text.dart';
import 'communities_list.dart'; import 'communities_list.dart';
import 'users_list.dart'; import 'users_list.dart';
@ -166,10 +167,13 @@ class InstancePage extends HookWidget {
children: [ children: [
Padding( Padding(
padding: const EdgeInsets.only(top: 40), padding: const EdgeInsets.only(top: 40),
child: CachedNetworkImage( child: FullscreenableImage(
width: 100, url: site.site.icon,
height: 100, child: CachedNetworkImage(
imageUrl: site.site.icon), width: 100,
height: 100,
imageUrl: site.site.icon),
),
), ),
Text(site.site.name, Text(site.site.name,
style: theme.textTheme.headline6), style: theme.textTheme.headline6),

View File

@ -5,6 +5,7 @@ import 'package:lemmur/pages/media_view.dart';
import 'package:markdown/markdown.dart' as md; import 'package:markdown/markdown.dart' as md;
import '../url_launcher.dart'; import '../url_launcher.dart';
import 'fullscreenable_image.dart';
class MarkdownText extends StatelessWidget { class MarkdownText extends StatelessWidget {
final String text; final String text;
@ -31,13 +32,16 @@ class MarkdownText extends StatelessWidget {
builder: (context) => MediaViewPage(uri.toString()), builder: (context) => MediaViewPage(uri.toString()),
)); ));
}, },
child: CachedNetworkImage( child: FullscreenableImage(
imageUrl: uri.toString(), url: uri.toString(),
errorWidget: (context, url, error) => Row( child: CachedNetworkImage(
children: [ imageUrl: uri.toString(),
Icon(Icons.warning), errorWidget: (context, url, error) => Row(
Text("couldn't load image, ${error.toString()}") children: [
], Icon(Icons.warning),
Text("couldn't load image, ${error.toString()}")
],
),
), ),
), ),
), ),

View File

@ -13,6 +13,7 @@ import '../url_launcher.dart';
import '../util/api_extensions.dart'; import '../util/api_extensions.dart';
import '../util/goto.dart'; import '../util/goto.dart';
import 'bottom_modal.dart'; import 'bottom_modal.dart';
import 'fullscreenable_image.dart';
import 'markdown_text.dart'; import 'markdown_text.dart';
enum MediaType { enum MediaType {
@ -377,15 +378,12 @@ class Post extends StatelessWidget {
Widget postImage() { Widget postImage() {
assert(post.url != null); assert(post.url != null);
return InkWell( return FullscreenableImage(
onTap: () => _openFullImage(context), url: post.url,
child: Hero( child: CachedNetworkImage(
tag: post.url, imageUrl: post.url,
child: CachedNetworkImage( progressIndicatorBuilder: (context, url, progress) =>
imageUrl: post.url, CircularProgressIndicator(value: progress.progress),
progressIndicatorBuilder: (context, url, progress) =>
CircularProgressIndicator(value: progress.progress),
),
), ),
); );
} }