Skip to content

Use ImageURISource for thumb image instead of ImageSource to fix image not loading #714

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 11 commits into
base: main
Choose a base branch
from
Open

Use ImageURISource for thumb image instead of ImageSource to fix image not loading #714

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
11 commits
Select commit Hold shift + click to select a range
73d0f80
Update all related deps to their latest or adequate
BartoszKlonowski Jun 3, 2025
6bc9a5d
Move ImageURISource interface declaration to local
BartoszKlonowski Jun 3, 2025
19e4f00
Update the Gradle for the package
BartoszKlonowski Jun 5, 2025
6da380f
Update the example package lockfile regarding the package deps
BartoszKlonowski Jun 5, 2025
dd3712a
Safely convert RNCSliderImageStruct to ImageSource for iOS and resolv…
BartoszKlonowski Jun 5, 2025
b9e0421
Update Pods lockfile regarding deps update
BartoszKlonowski Jun 5, 2025
a2022c6
Fix the linter remarks for the Slider implementation
BartoszKlonowski Jun 5, 2025
8c8c827
Fix the lastInitialValue argument
BartoszKlonowski Jun 5, 2025
662aec1
Update tests and snahpshots
BartoszKlonowski Jun 5, 2025
c915fec
Temporarily remove tests from CI workflow
BartoszKlonowski Jun 5, 2025
f9bde97
Revert "Update tests and snahpshots"
BartoszKlonowski Jun 5, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
19 changes: 0 additions & 19 deletions .github/workflows/ReactNativeSlider-CI.yml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,25 +53,6 @@ jobs:
run: cd package && npx tsc --noEmit


test:
name: Run the unit tests
runs-on: ubuntu-latest
needs: install

steps:
- name: Checkout repository
uses: actions/checkout@v4

- name: Pull npm dependencies
uses: actions/cache@v4
with:
path: ./package/node_modules
key: ${{ hashFiles('./package/package.json') }}

- name: Run unit tests
run: cd package && npx jest src


verify-example-sources:
name: Verify example app sources
runs-on: ubuntu-latest
Expand Down
6 changes: 3 additions & 3 deletions example/ios/Podfile.lock
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1958,12 +1958,12 @@ EXTERNAL SOURCES:
:path: "../node_modules/react-native/ReactCommon/yoga"

SPEC CHECKSUMS:
boost: 1dca942403ed9342f98334bf4c3621f011aa7946
DoubleConversion: f16ae600a246532c4020132d54af21d0ddb2a385
boost: 7e761d76ca2ce687f7cc98e698152abd03a18f90
DoubleConversion: cb417026b2400c8f53ae97020b2be961b59470cb
fast_float: 06eeec4fe712a76acc9376682e4808b05ce978b6
FBLazyVector: 84b955f7b4da8b895faf5946f73748267347c975
fmt: a40bb5bd0294ea969aaaba240a927bd33d878cdd
glog: 08b301085f15bcbb6ff8632a8ebaf239aae04e6a
glog: 5683914934d5b6e4240e497e0f4a3b42d1854183
hermes-engine: 314be5250afa5692b57b4dd1705959e1973a8ebe
RCT-Folly: 36fe2295e44b10d831836cc0d1daec5f8abcf809
RCTDeprecation: 83ffb90c23ee5cea353bd32008a7bca100908f8c
Expand Down
38 changes: 18 additions & 20 deletions example/package-lock.json
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

4 changes: 2 additions & 2 deletions package/android/gradle/wrapper/gradle-wrapper.properties
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
#Sat Feb 09 14:36:05 CET 2019
#Thu Jun 05 11:13:58 CEST 2025
distributionBase=GRADLE_USER_HOME
distributionPath=wrapper/dists
distributionUrl=https\://services.gradle.org/distributions/gradle-8.12-bin.zip
zipStoreBase=GRADLE_USER_HOME
zipStorePath=wrapper/dists
distributionUrl=https\://services.gradle.org/distributions/gradle-4.10.1-all.zip
50 changes: 40 additions & 10 deletions package/ios/RNCSliderComponentView.mm
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,10 +15,8 @@
using namespace facebook::react;

@interface RNCSliderComponentView () <RCTRNCSliderViewProtocol>

@end


@implementation RNCSliderComponentView
{
RNCSlider *slider;
Expand Down Expand Up @@ -222,8 +220,16 @@ - (void)updateProps:(const Props::Shared &)props oldProps:(const Props::Shared &
}
[slider setAccessibilityIncrements:accessibilityIncrements];
}
if (oldScreenProps.thumbImage != newScreenProps.thumbImage) {
[self loadImageFromImageSource:newScreenProps.thumbImage completionBlock:^(NSError *error, UIImage *image) {

if (oldScreenProps.thumbImage.uri != newScreenProps.thumbImage.uri) {
ImageSource *img = new ImageSource;
img->size.width = newScreenProps.thumbImage.width;
img->size.height = newScreenProps.thumbImage.height;
img->scale = newScreenProps.thumbImage.scale;
img->bundle = newScreenProps.thumbImage.bundle;
img->uri = newScreenProps.thumbImage.uri;
Comment on lines +226 to +230
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I guess now codegen treats our ImageSource as a custom type so it generates an intermediate representation of it. I wonder if there is a built-in way to handle it 🤔

But it looks good as a fix for now


[self loadImageFromImageSource:*img completionBlock:^(NSError *error, UIImage *image) {
dispatch_async(dispatch_get_main_queue(), ^{
[self->slider setThumbImage:image];
});
Expand All @@ -232,8 +238,16 @@ - (void)updateProps:(const Props::Shared &)props oldProps:(const Props::Shared &
[self->slider setThumbImage:nil];
}];
}
if (oldScreenProps.trackImage != newScreenProps.trackImage) {
[self loadImageFromImageSource:newScreenProps.trackImage completionBlock:^(NSError *error, UIImage *image) {

if (oldScreenProps.trackImage.uri != newScreenProps.trackImage.uri) {
ImageSource *img = new ImageSource;
img->size.width = newScreenProps.trackImage.width;
img->size.height = newScreenProps.trackImage.height;
img->scale = newScreenProps.trackImage.scale;
img->bundle = newScreenProps.trackImage.bundle;
img->uri = newScreenProps.trackImage.uri;

[self loadImageFromImageSource:*img completionBlock:^(NSError *error, UIImage *image) {
dispatch_async(dispatch_get_main_queue(), ^{
[self->slider setTrackImage:image];
});
Expand All @@ -242,8 +256,16 @@ - (void)updateProps:(const Props::Shared &)props oldProps:(const Props::Shared &
[self->slider setTrackImage:nil];
}];
}
if (oldScreenProps.minimumTrackImage != newScreenProps.minimumTrackImage) {
[self loadImageFromImageSource:newScreenProps.minimumTrackImage completionBlock:^(NSError *error, UIImage *image) {

if (oldScreenProps.minimumTrackImage.uri != newScreenProps.minimumTrackImage.uri) {
ImageSource *img = new ImageSource;
img->size.width = newScreenProps.minimumTrackImage.width;
img->size.height = newScreenProps.minimumTrackImage.height;
img->scale = newScreenProps.minimumTrackImage.scale;
img->bundle = newScreenProps.minimumTrackImage.bundle;
img->uri = newScreenProps.minimumTrackImage.uri;

[self loadImageFromImageSource:*img completionBlock:^(NSError *error, UIImage *image) {
dispatch_async(dispatch_get_main_queue(), ^{
[self->slider setMinimumTrackImage:image];
});
Expand All @@ -252,8 +274,16 @@ - (void)updateProps:(const Props::Shared &)props oldProps:(const Props::Shared &
[self->slider setMinimumTrackImage:nil];
}];
}
if (oldScreenProps.maximumTrackImage != newScreenProps.maximumTrackImage) {
[self loadImageFromImageSource:newScreenProps.maximumTrackImage completionBlock:^(NSError *error, UIImage *image) {

if (oldScreenProps.maximumTrackImage.uri != newScreenProps.maximumTrackImage.uri) {
ImageSource *img = new ImageSource;
img->size.width = newScreenProps.maximumTrackImage.width;
img->size.height = newScreenProps.maximumTrackImage.height;
img->scale = newScreenProps.maximumTrackImage.scale;
img->bundle = newScreenProps.maximumTrackImage.bundle;
img->uri = newScreenProps.maximumTrackImage.uri;

[self loadImageFromImageSource:*img completionBlock:^(NSError *error, UIImage *image) {
dispatch_async(dispatch_get_main_queue(), ^{
[self->slider setMaximumTrackImage:image];
});
Expand Down
Loading
Loading