@gtkx/react / GtkSourceView

Variable: GtkSourceView

const GtkSourceView: (props) => ReactNode & object

Defined in: packages/react/src/generated/compounds.ts:2501

Subclass of Gtk.TextView.

GtkSourceView is the main class of the GtkSourceView library. Use a Buffer to display text with a GtkSourceView.

This class provides:

• Show the line numbers;
• Show a right margin;
• Highlight the current line;
• Indentation settings;
• Configuration for the Home and End keyboard keys;
• Configure and show line marks;
• And a few other things.

An easy way to test all these features is to use the test-widget mini-program provided in the GtkSourceView repository, in the tests/ directory.

GtkSourceView as GtkBuildable

The GtkSourceView implementation of the Gtk.Buildable interface exposes the View.completion object with the internal-child "completion".

An example of a UI definition fragment with GtkSourceView:

<object class="GtkSourceView" id="source_view">
  <property name="tab-width">4</property>
  <property name="auto-indent">True</property>
  <child internal-child="completion">
    <object class="GtkSourceCompletion">
      <property name="select-on-show">False</property>
    </object>
  </child>
</object>

Changing the Font

Gtk CSS provides the best way to change the font for a GtkSourceView in a manner that allows for components like Map to scale the desired font.

GtkCssProvider *provider = gtk_css_provider_new ();
gtk_css_provider_load_from_string (provider,
                                  "textview { font-family: Monospace; font-size: 8pt; }");
gtk_style_context_add_provider (gtk_widget_get_style_context (view),
                                GTK_STYLE_PROVIDER (provider),
                                GTK_STYLE_PROVIDER_PRIORITY_APPLICATION);
g_object_unref (provider);

provider = Gtk.CssProvider()
provider.load_from_string("textview { font-family: Monospace; font-size: 8pt; }")
style_context = view.get_style_context()
style_context.add_provider(provider, Gtk.STYLE_PROVIDER_PRIORITY_APPLICATION)

If you need to adjust the font or size of font within a portion of the document only, you should use a Gtk.TextTag with the Gtk.TextTag.family or Gtk.TextTag.scale set so that the font size may be scaled relative to the default font set in CSS.

Type Declaration

Name	Type	Defined in
Anchor()	(props) => ReactNode	packages/react/src/generated/compounds.ts:2503
Paintable()	(props) => ReactNode	packages/react/src/generated/compounds.ts:2504
Tag()	(props) => ReactNode	packages/react/src/generated/compounds.ts:2502