randogoth/muzzle-velocity
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

markdown and latex preview

Browse source
This commit is contained in:
randogoth 2025-02-21 18:16:17 +02:00
parent c574f456a0
commit 185a1c62e9
4 changed files with 195 additions and 46 deletions
Download patch file Download diff file Expand all files Collapse all files

2
lib/main.dart
View file

@ -309,7 +309,7 @@ class _NoteListScreenState extends State<NoteListScreen> {
padding: EdgeInsets.symmetric(horizontal: 15),
child: PopupMenuButton<String>(
icon: Icon(
Icons.trip_origin,
Icons.radio_button_checked,
color: Colors.orange
), // Menu button (⋮)
onSelected: (String value) {

125
lib/note_editor.dart
View file

@ -1,5 +1,8 @@
import 'package:flutter/material.dart';
import 'package:flutter_code_editor/flutter_code_editor.dart';
import 'package:flutter_markdown/flutter_markdown.dart';
import 'package:markdown/markdown.dart' as md;
import 'package:flutter_markdown_latex/flutter_markdown_latex.dart';
import 'themes/day.dart';
import 'themes/night.dart';
import 'themes/markdown.dart';
@ -16,6 +19,7 @@ class NoteEditorScreen extends StatefulWidget {
}
class _NoteEditorScreenState extends State<NoteEditorScreen> {
bool _isPreviewMode = false; // Default: Editing mode
late CodeController _controller;
double _fontSize = 16.0; // Default font size
@ -61,59 +65,90 @@ class _NoteEditorScreenState extends State<NoteEditorScreen> {
appBar: AppBar(
title: Text(widget.note.uri.pathSegments.last.replaceAll('.md', '')),
actions: [
PopupMenuButton<String>(
icon: Icon(Icons.more_vert), // Menu button (⋮)
onSelected: (String value) {
if (value == 'Toggle Theme') {
setState(() {
widget.isDarkMode = !widget.isDarkMode;
});
}
},
itemBuilder: (BuildContext context) => [
PopupMenuItem<String>(
value: 'Toggle Theme',
child: ListTile(
leading: Icon(
widget.isDarkMode ? Icons.light_mode : Icons.dark_mode,
),
title: Text(
widget.isDarkMode ? 'Switch to Light Mode' : 'Switch to Dark Mode',
Padding(
padding: EdgeInsets.symmetric(horizontal: 15),
child: PopupMenuButton<String>(
icon: Icon(
Icons.radio_button_checked,
color: Colors.orange
),
onSelected: (String value) {
if (value == 'Toggle Preview') {
setState(() {
_isPreviewMode = !_isPreviewMode;
});
}
},
itemBuilder: (BuildContext context) => [
PopupMenuItem<String>(
value: 'Toggle Preview',
child: ListTile(
leading: Icon(_isPreviewMode ? Icons.edit : Icons.preview),
title: Text(_isPreviewMode ? 'Edit Mode' : 'Preview Mode'),
),
),
),
PopupMenuItem<String>(
enabled: false,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text('Font Size'),
StatefulBuilder(
builder: (context, setState) {
return Slider(
value: _fontSize,
min: 12.0,
max: 24.0,
divisions: 6,
label: _fontSize.toString(),
onChanged: (newSize) {
setState(() {
_fontSize = newSize;
});
_updateFontSize(newSize);
},
);
},
),
],
PopupMenuItem<String>(
enabled: false,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text('Font Size'),
StatefulBuilder(
builder: (context, setState) {
return Slider(
value: _fontSize,
min: 12.0,
max: 24.0,
divisions: 6,
label: _fontSize.toString(),
onChanged: (newSize) {
setState(() {
_fontSize = newSize;
});
_updateFontSize(newSize);
},
);
},
),
],
),
),
),
],
],
),
),
],
),
body: _controller == null
? Center(child: CircularProgressIndicator())
: _isPreviewMode
? Padding(
padding: const EdgeInsets.all(16.0),
child: SingleChildScrollView(
child: MarkdownBody(
builders: {
'latex': LatexElementBuilder(
textStyle: TextStyle(
color: widget.isDarkMode ? Colors.white : Colors.black
)
),
},
extensionSet: md.ExtensionSet(
[LatexBlockSyntax()],
[LatexInlineSyntax()],
),
data: _controller.text, // ✅ Plain Markdown without syntax highlighting
selectable: true, // ✅ Allows text selection
styleSheet: MarkdownStyleSheet(
p: TextStyle(fontSize: _fontSize, color: widget.isDarkMode ? Colors.white : Colors.black),
h1: TextStyle(fontSize: _fontSize + 8, color: widget.isDarkMode ? Colors.white : Colors.black, fontWeight: FontWeight.bold),
h2: TextStyle(fontSize: _fontSize + 6, color: widget.isDarkMode ? Colors.white : Colors.black, fontWeight: FontWeight.bold),
h3: TextStyle(fontSize: _fontSize + 4, color: widget.isDarkMode ? Colors.white : Colors.black, fontWeight: FontWeight.bold),
code: TextStyle(fontSize: _fontSize, backgroundColor: Colors.transparent), // ✅ Disables syntax highlighting
codeblockDecoration: BoxDecoration(color: Colors.transparent), // ✅ Removes background color from code blocks
),
),
),
)
: Padding(
padding: const EdgeInsets.all(16.0),
child: CodeTheme(