bdlukaa / bdlukaa/rounded_background_text
[enhancement] Better hit detection
- Dominant language
- Dart
- Stars
- 57
- Forks
- 15
- PR merge metrics
- No merged PRs in 30d
Description
**Is your feature request related to a problem? Please describe.**
The hit area of the widget is currently suboptimal. The problem occurs when there is text with multiple blank lines in between. In this situation, the widget will continue to respond to hit events even if the user taps in those blank spaces. In the image below, you can see the region that is mistakenly identified as a hit target colored green. In my opinion, the widget should only detect a hit event when the user taps on the text with the background, which is below colored in amber.

**Describe the solution you'd like**
We should override the `hitTest` method of the `CustomPainter` inside the `RoundedBackgroundTextPainter` class. Below is a simple example of how to do this.
```dart
@override
bool? hitTest(Offset position) {
// Retrieve the line information
final lineInfos = computeLines(text);
// Check each line
for (final lineInfo in lineInfos) {
for (final info in lineInfo) {
// Construct the rounded rectangle for this line
final rRect = RRect.fromLTRBR(
info.x,
info.y,
info.fullWidth,
info.fullHeight,
Radius.circular(info.outerRadius(outerRadius)),
);
// Check if the position is within this rectangle
if (rRect.contains(position)) {
onHitTestResult(true); // Call method with the result for external handling
return true;
}
}
}
// If the position was not within any line's bounding box
onHitTestResult(false); // Call method with the result for external handling
return false;
}
```
This example is simple and will not perfectly detect any inner rounding. It will also not detect the surrounding padding.
Maybe you have a better solution, but I think for most cases this simple hit detection will be enough. For me it will also be useful if it always calls a method like `onHitTestResult` which returns if the hitTest is true or false. This is helpful for applications that have more complex logic with many layers. So in the end the widget will look like this then.
```Dart
RoundedBackgroundText(
'Text',
onHitTestResult: (hit) {
/// Handle hit
},
backgroundColor: Colors.amber,
),
```
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.