Creating Logic Blocks using C# or Blockly

Logic blocks in Bloqs allow you to add dynamic behavior to your application. They are used to drive UI interactions such as:

  • Showing or hiding components

  • Enabling or disabling buttons

  • Applying dynamic styles

  • Executing custom actions at runtime


C# Logic Blocks

Logic blocks can be implemented in C# at design-time. This gives developers full control over how the logic behaves.

Example – Hello World Logic Block in C#:

.AddLogicBlock<Logic.HelloWorld>(
    new LogicBlock
    {
        Id = AppConstants.LogicBlocks.HelloWorld,
        Name = nameof(AppConstants.LogicBlocks.HelloWorld),
        Kind = LogicBlockKind.CSharp,
        ResultType = LogicBlockResult.NoResult,
        ExecutionLayer = LogicBlockExecutionLayer.UserInterface,
    }
)

Implementing the Handler

To handle a C# logic block, you implement the ILogicHandler interface.

using Bloqs.App.Engine.Logic;
using Bloqs.App.Engine.Logic.Handlers;
using Bloqs.App.Engine.Logic.Result;

namespace Templates.SampleApp.Models.Logic;

public class HelloWorld : ILogicHandler
{
    public Task<LogicResult> ExecuteAsync(LogicContext context)
    {
        Console.WriteLine("Hello World!");

        context.NotificationService.Notify(
            "Hello World from Logic Handler!",
            Bloqs.App.Engine.AlertStyle.Success
        );

        return Task.FromResult((LogicResult)new BooleanLogicResult() { Result = true });
    }
}

Here, the logic block simply prints "Hello World!" to the console.


Blockly Logic Blocks

Blockly logic blocks are visually modeled in the Modeler UI inside the web browser.

⚠️ Disclaimer: Normally, you would not define Blockly logic blocks in C# code. They are designed to be created and modified at runtime using the drag-and-drop visual interface.

A Blockly workspace is stored as JSON and compiled into Lua for execution.

Example – Show Notification with Blockly:

.AddLogicBlock(
    new LogicBlock
    {
        Id = AppConstants.LogicBlocks.ShowNotification,
        Name = nameof(AppConstants.LogicBlocks.ShowNotification),
        Kind = LogicBlockKind.Blockly,
        ResultType = LogicBlockResult.NoResult,
        ExecutionLayer = LogicBlockExecutionLayer.UserInterface,
        BlocklyWorkspace = new BlocklyWorkspace()
        {
            BlocklyJson = @"{ ... }",
            LuaCode = @"bq_messaging:Notify(('Hello ' .. bq_user:GetUserName())) return result",
        },
    }
)

This example displays a notification with a greeting like “Hello John”.


Summary

  • Use C# logic blocks for design-time, developer-controlled logic.

  • Use Blockly logic blocks for runtime, no-code/low-code logic modeling inside the web UI.

  • Logic blocks are currently UI-only and allow you to dynamically control visibility, styling, and behavior of components.

Last updated