Mouse State

Click-and-Drag Selection

How do I implement a click-and-drag selection rectangle?

Abstract art representing computer programming

Implementing a selection rectangle involves tracking the start and current positions of a drag operation to define the rectangle's bounds. Here's how to create one:

1#include <SDL.h>
2#include <iostream>
3#include "Window.h"
4
5class SelectionBox {
6 public:
7  void Tick() {
8    int MouseX, MouseY;
9    Uint32 Buttons = SDL_GetMouseState(
10      &MouseX, &MouseY);
11
12    if (Buttons & SDL_BUTTON_LMASK) {
13      if (!IsSelecting) {
14        // Start new selection
15        StartX = MouseX;
16        StartY = MouseY;
17        IsSelecting = true;
18      }
19
20      // Calculate rectangle bounds
21      CurrentX = MouseX;
22      CurrentY = MouseY;
23
24      int Left = std::min(StartX, CurrentX);
25      int Right = std::max(StartX, CurrentX);
26      int Top = std::min(StartY, CurrentY);
27      int Bottom = std::max(StartY, CurrentY);
28
29      int Width = Right - Left;
30      int Height = Bottom - Top;
31
32      std::cout << "Selection: Position("
33        << Left << ", " << Top << ") "
34        << "Size(" << Width << ", "
35        << Height << ")\n";
36    } else if (IsSelecting) {
37      // Selection complete
38      IsSelecting = false;
39      PrintFinalSelection();
40    }
41  }
42
43 private:
44  bool IsSelecting{false};
45  int StartX{0}, StartY{0};
46  int CurrentX{0}, CurrentY{0};
47
48  void PrintFinalSelection() {
49    int Left = std::min(StartX, CurrentX);
50    int Right = std::max(StartX, CurrentX);
51    int Top = std::min(StartY, CurrentY);
52    int Bottom = std::max(StartY, CurrentY);
53
54    std::cout << "Final selection area: ("
55      << Left << ", " << Top << ") to ("
56      << Right << ", " << Bottom << ")\n";
57  }
58};
59
60int main(int argc, char** argv) {
61  SDL_Init(SDL_INIT_VIDEO);
62  Window GameWindow;
63  SelectionBox Selection;
64  SDL_Event E;
65
66  while (true) {
67    while (SDL_PollEvent(&E)) {
68      // Handle other events...
69    }
70
71    Selection.Tick();
72    GameWindow.Update();
73  }
74
75  SDL_Quit();
76  return 0;
77}

1Selection: Position(100, 150) Size(5, 3)
2Selection: Position(100, 150) Size(10, 8)
3Selection: Position(100, 150) Size(15, 12)
4Final selection area: (100, 150) to (115, 162)

How It Works

The selection rectangle system works by:

Storing the initial click position when the left mouse button is first pressed
Continuously updating the current mouse position while dragging
Calculating the rectangle bounds by finding the minimum and maximum X/Y coordinates
Supporting selections in any direction (up/down/left/right)

Enhanced Version

Here's an enhanced version that includes minimum size and snapping:

1#include <SDL.h>
2
3class AdvancedSelectionBox {
4 public:
5  void Tick() {
6    int MouseX, MouseY;
7    Uint32 Buttons = SDL_GetMouseState(
8      &MouseX, &MouseY);
9
10    if (Buttons & SDL_BUTTON_LMASK) {
11      if (!IsSelecting) {
12        StartX = MouseX;
13        StartY = MouseY;
14        IsSelecting = true;
15      }
16
17      CurrentX = MouseX;
18      CurrentY = MouseY;
19
20      // Add minimum size requirement
21      int Width = std::abs(CurrentX - StartX);
22      int Height = std::abs(CurrentY - StartY);
23
24      if (Width < MinimumSize) {
25        CurrentX = StartX + (CurrentX > StartX
26          ? MinimumSize : -MinimumSize);
27      }
28
29      if (Height < MinimumSize) {
30        CurrentY = StartY + (CurrentY > StartY
31          ? MinimumSize : -MinimumSize);
32      }
33
34      // Snap to grid
35      CurrentX = (CurrentX / GridSize) * GridSize;
36      CurrentY = (CurrentY / GridSize) * GridSize;
37
38      PrintSelection();
39    } else if (IsSelecting) {
40      IsSelecting = false;
41      PrintFinalSelection();
42    }
43  }
44
45 private:
46  static const int MinimumSize = 10;
47  static const int GridSize = 8;
48  bool IsSelecting{false};
49  int StartX{0}, StartY{0};
50  int CurrentX{0}, CurrentY{0};
51};