Skip to content
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.

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

Implement missing measurements on android #6413

Merged
merged 5 commits into from
Aug 26, 2024

Conversation

Latropos
Copy link
Contributor

@Latropos Latropos commented Aug 13, 2024

Summary

Implement measurement of relative coordinates on Android.

Test plan

I've added more logic to runtime tests to include parent component changes in calculations.

Example code to log measurement
import React from 'react';
import { Button, StyleSheet, View } from 'react-native';
import type { MeasuredDimensions } from 'react-native-reanimated';
import Animated, {
  measure,
  runOnUI,
  useAnimatedRef,
  useSharedValue,
} from 'react-native-reanimated';

const EXPECTED_MEASUREMENT = {
  height: 100,
  pageX: 302,
  width: 80,
  x: 120,
  y: 150,
};

export default function App() {
  const animatedRef = useAnimatedRef<Animated.View>();

  const measurement = useSharedValue<MeasuredDimensions | null>(null);

  const handlePress = () => {
    runOnUI(() => {
      'worklet';
      measurement.value = measure(animatedRef);
      console.log(measurement.value);
    })();
  };

  return (
    <View style={styles.container}>
      <View style={styles.bigBox}>
        <Animated.View ref={animatedRef} style={styles.box} />
      </View>
      <Button onPress={handlePress} title="Click me" />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
  },
  bigBox: {
    position: 'absolute',
    top: 0,
    left: EXPECTED_MEASUREMENT.pageX - EXPECTED_MEASUREMENT.x,
    height: 300,
    width: 300,
    borderColor: '#b58df1',
    borderWidth: 2,
  },
  box: {
    top: EXPECTED_MEASUREMENT.y,
    left: EXPECTED_MEASUREMENT.x,
    height: EXPECTED_MEASUREMENT.height,
    width: EXPECTED_MEASUREMENT.width,
    backgroundColor: '#b58df1',
  },
});

@Latropos Latropos marked this pull request as ready for review August 13, 2024 13:59
@Latropos Latropos force-pushed the acynk/implement-measure-android branch from bfbe3e6 to aeb5af8 Compare August 14, 2024 08:04
github-merge-queue bot pushed a commit that referenced this pull request Aug 20, 2024
Bumps [axios](https://github.com/axios/axios) from 1.6.8 to 1.7.4.
<details>
<summary>Release notes</summary>
<p><em>Sourced from <a
href="https://github.com/axios/axios/releases">axios's
releases</a>.</em></p>
<blockquote>
<h2>Release v1.7.4</h2>
<h2>Release notes:</h2>
<h3>Bug Fixes</h3>
<ul>
<li><strong>sec:</strong> CVE-2024-39338 (<a
href="https://github.com/axios/axios/issues/6539">#6539</a>)
(<a
href="https://github.com/axios/axios/issues/6543">#6543</a>)
(<a
href="https://github.com/axios/axios/commit/6b6b605eaf73852fb2dae033f1e786155959de3a">6b6b605</a>)</li>
<li><strong>sec:</strong> disregard protocol-relative URL to remediate
SSRF (<a
href="https://github.com/axios/axios/issues/6539">#6539</a>)
(<a
href="https://github.com/axios/axios/commit/07a661a2a6b9092c4aa640dcc7f724ec5e65bdda">07a661a</a>)</li>
</ul>
<h3>Contributors to this release</h3>
<ul>
<li><!-- raw HTML omitted --> <a href="https://github.com/levpachmanov"
title="+47/-11 ([#6543](axios/axios#6543)
)">Lev Pachmanov</a></li>
<li><!-- raw HTML omitted --> <a href="https://github.com/hainenber"
title="+49/-4 ([#6539](axios/axios#6539) )">Đỗ
Trọng Hải</a></li>
</ul>
<h2>Release v1.7.3</h2>
<h2>Release notes:</h2>
<h3>Bug Fixes</h3>
<ul>
<li><strong>adapter:</strong> fix progress event emitting; (<a
href="https://github.com/axios/axios/issues/6518">#6518</a>)
(<a
href="https://github.com/axios/axios/commit/e3c76fc9bdd03aa4d98afaf211df943e2031453f">e3c76fc</a>)</li>
<li><strong>fetch:</strong> fix withCredentials request config (<a
href="https://github.com/axios/axios/issues/6505">#6505</a>)
(<a
href="https://github.com/axios/axios/commit/85d4d0ea0aae91082f04e303dec46510d1b4e787">85d4d0e</a>)</li>
<li><strong>xhr:</strong> return original config on errors from XHR
adapter (<a
href="https://github.com/axios/axios/issues/6515">#6515</a>)
(<a
href="https://github.com/axios/axios/commit/8966ee7ea62ecbd6cfb39a905939bcdab5cf6388">8966ee7</a>)</li>
</ul>
<h3>Contributors to this release</h3>
<ul>
<li><!-- raw HTML omitted --> <a
href="https://github.com/DigitalBrainJS" title="+211/-159
([#6518](axios/axios#6518)
[#6519](axios/axios#6519) )">Dmitriy
Mozgovoy</a></li>
<li><!-- raw HTML omitted --> <a href="https://github.com/ValeraS"
title="+3/-3 ([#6515](axios/axios#6515)
)">Valerii Sidorenko</a></li>
<li><!-- raw HTML omitted --> <a href="https://github.com/prianyu"
title="+2/-2 ([#6505](axios/axios#6505)
)">prianYu</a></li>
</ul>
<h2>Release v1.7.2</h2>
<h2>Release notes:</h2>
<h3>Bug Fixes</h3>
<ul>
<li><strong>fetch:</strong> enhance fetch API detection; (<a
href="https://github.com/axios/axios/issues/6413">#6413</a>)
(<a
href="https://github.com/axios/axios/commit/4f79aef81b7c4644328365bfc33acf0a9ef595bc">4f79aef</a>)</li>
</ul>
<h3>Contributors to this release</h3>
<ul>
<li><!-- raw HTML omitted --> <a
href="https://github.com/DigitalBrainJS" title="+3/-3
([#6413](axios/axios#6413) )">Dmitriy
Mozgovoy</a></li>
</ul>
<h2>Release v1.7.1</h2>
<h2>Release notes:</h2>
<h3>Bug Fixes</h3>
<ul>
<li><strong>fetch:</strong> fixed ReferenceError issue when TextEncoder
is not available in the environment; (<a
href="https://github.com/axios/axios/issues/6410">#6410</a>)
(<a
href="https://github.com/axios/axios/commit/733f15fe5bd2d67e1fadaee82e7913b70d45dc5e">733f15f</a>)</li>
</ul>
<h3>Contributors to this release</h3>
<ul>
<li><!-- raw HTML omitted --> <a
href="https://github.com/DigitalBrainJS" title="+14/-9
([#6410](axios/axios#6410) )">Dmitriy
Mozgovoy</a></li>
</ul>
<h2>Release v1.7.0</h2>
<h2>Release notes:</h2>
<h3>Features</h3>
<!-- raw HTML omitted -->
</blockquote>
<p>... (truncated)</p>
</details>
<details>
<summary>Changelog</summary>
<p><em>Sourced from <a
href="https://github.com/axios/axios/blob/v1.x/CHANGELOG.md">axios's
changelog</a>.</em></p>
<blockquote>
<h2><a
href="https://github.com/axios/axios/compare/v1.7.3...v1.7.4">1.7.4</a>
(2024-08-13)</h2>
<h3>Bug Fixes</h3>
<ul>
<li><strong>sec:</strong> CVE-2024-39338 (<a
href="https://github.com/axios/axios/issues/6539">#6539</a>)
(<a
href="https://github.com/axios/axios/issues/6543">#6543</a>)
(<a
href="https://github.com/axios/axios/commit/6b6b605eaf73852fb2dae033f1e786155959de3a">6b6b605</a>)</li>
<li><strong>sec:</strong> disregard protocol-relative URL to remediate
SSRF (<a
href="https://github.com/axios/axios/issues/6539">#6539</a>)
(<a
href="https://github.com/axios/axios/commit/07a661a2a6b9092c4aa640dcc7f724ec5e65bdda">07a661a</a>)</li>
</ul>
<h3>Contributors to this release</h3>
<ul>
<li><!-- raw HTML omitted --> <a href="https://github.com/levpachmanov"
title="+47/-11 ([#6543](axios/axios#6543)
)">Lev Pachmanov</a></li>
<li><!-- raw HTML omitted --> <a href="https://github.com/hainenber"
title="+49/-4 ([#6539](axios/axios#6539) )">Đỗ
Trọng Hải</a></li>
</ul>
<h2><a
href="https://github.com/axios/axios/compare/v1.7.2...v1.7.3">1.7.3</a>
(2024-08-01)</h2>
<h3>Bug Fixes</h3>
<ul>
<li><strong>adapter:</strong> fix progress event emitting; (<a
href="https://github.com/axios/axios/issues/6518">#6518</a>)
(<a
href="https://github.com/axios/axios/commit/e3c76fc9bdd03aa4d98afaf211df943e2031453f">e3c76fc</a>)</li>
<li><strong>fetch:</strong> fix withCredentials request config (<a
href="https://github.com/axios/axios/issues/6505">#6505</a>)
(<a
href="https://github.com/axios/axios/commit/85d4d0ea0aae91082f04e303dec46510d1b4e787">85d4d0e</a>)</li>
<li><strong>xhr:</strong> return original config on errors from XHR
adapter (<a
href="https://github.com/axios/axios/issues/6515">#6515</a>)
(<a
href="https://github.com/axios/axios/commit/8966ee7ea62ecbd6cfb39a905939bcdab5cf6388">8966ee7</a>)</li>
</ul>
<h3>Contributors to this release</h3>
<ul>
<li><!-- raw HTML omitted --> <a
href="https://github.com/DigitalBrainJS" title="+211/-159
([#6518](axios/axios#6518)
[#6519](axios/axios#6519) )">Dmitriy
Mozgovoy</a></li>
<li><!-- raw HTML omitted --> <a href="https://github.com/ValeraS"
title="+3/-3 ([#6515](axios/axios#6515)
)">Valerii Sidorenko</a></li>
<li><!-- raw HTML omitted --> <a href="https://github.com/prianyu"
title="+2/-2 ([#6505](axios/axios#6505)
)">prianYu</a></li>
</ul>
<h2><a
href="https://github.com/axios/axios/compare/v1.7.1...v1.7.2">1.7.2</a>
(2024-05-21)</h2>
<h3>Bug Fixes</h3>
<ul>
<li><strong>fetch:</strong> enhance fetch API detection; (<a
href="https://github.com/axios/axios/issues/6413">#6413</a>)
(<a
href="https://github.com/axios/axios/commit/4f79aef81b7c4644328365bfc33acf0a9ef595bc">4f79aef</a>)</li>
</ul>
<h3>Contributors to this release</h3>
<ul>
<li><!-- raw HTML omitted --> <a
href="https://github.com/DigitalBrainJS" title="+3/-3
([#6413](axios/axios#6413) )">Dmitriy
Mozgovoy</a></li>
</ul>
<h2><a
href="https://github.com/axios/axios/compare/v1.7.0...v1.7.1">1.7.1</a>
(2024-05-20)</h2>
<h3>Bug Fixes</h3>
<ul>
<li><strong>fetch:</strong> fixed ReferenceError issue when TextEncoder
is not available in the environment; (<a
href="https://github.com/axios/axios/issues/6410">#6410</a>)
(<a
href="https://github.com/axios/axios/commit/733f15fe5bd2d67e1fadaee82e7913b70d45dc5e">733f15f</a>)</li>
</ul>
<h3>Contributors to this release</h3>
<ul>
<li><!-- raw HTML omitted --> <a
href="https://github.com/DigitalBrainJS" title="+14/-9
([#6410](axios/axios#6410) )">Dmitriy
Mozgovoy</a></li>
</ul>
<!-- raw HTML omitted -->
</blockquote>
<p>... (truncated)</p>
</details>
<details>
<summary>Commits</summary>
<ul>
<li><a
href="https://github.com/axios/axios/commit/abd24a7367726616e60dfc04cb394b4be37cf597"><code>abd24a7</code></a>
chore(release): v1.7.4 (<a
href="https://github.com/axios/axios/issues/6544">#6544</a>)</li>
<li><a
href="https://github.com/axios/axios/commit/6b6b605eaf73852fb2dae033f1e786155959de3a"><code>6b6b605</code></a>
fix(sec): CVE-2024-39338 (<a
href="https://github.com/axios/axios/issues/6539">#6539</a>)
(<a
href="https://github.com/axios/axios/issues/6543">#6543</a>)</li>
<li><a
href="https://github.com/axios/axios/commit/07a661a2a6b9092c4aa640dcc7f724ec5e65bdda"><code>07a661a</code></a>
fix(sec): disregard protocol-relative URL to remediate SSRF (<a
href="https://github.com/axios/axios/issues/6539">#6539</a>)</li>
<li><a
href="https://github.com/axios/axios/commit/c6cce43cd94489f655f4488c5a50ecaf781c94f2"><code>c6cce43</code></a>
chore(release): v1.7.3 (<a
href="https://github.com/axios/axios/issues/6521">#6521</a>)</li>
<li><a
href="https://github.com/axios/axios/commit/e3c76fc9bdd03aa4d98afaf211df943e2031453f"><code>e3c76fc</code></a>
fix(adapter): fix progress event emitting; (<a
href="https://github.com/axios/axios/issues/6518">#6518</a>)</li>
<li><a
href="https://github.com/axios/axios/commit/85d4d0ea0aae91082f04e303dec46510d1b4e787"><code>85d4d0e</code></a>
fix(fetch): fix withCredentials request config (<a
href="https://github.com/axios/axios/issues/6505">#6505</a>)</li>
<li><a
href="https://github.com/axios/axios/commit/92cd8ed94362f929d3d0ed85ca84296c0ac8fd6d"><code>92cd8ed</code></a>
chore(github): update ISSUE_TEMPLATE.md (<a
href="https://github.com/axios/axios/issues/6519">#6519</a>)</li>
<li><a
href="https://github.com/axios/axios/commit/8966ee7ea62ecbd6cfb39a905939bcdab5cf6388"><code>8966ee7</code></a>
fix(xhr): return original config on errors from XHR adapter (<a
href="https://github.com/axios/axios/issues/6515">#6515</a>)</li>
<li><a
href="https://github.com/axios/axios/commit/0e4f9fa29077ebee4499facea6be1492b42e8a26"><code>0e4f9fa</code></a>
chore(release): v1.7.2 (<a
href="https://github.com/axios/axios/issues/6414">#6414</a>)</li>
<li><a
href="https://github.com/axios/axios/commit/4f79aef81b7c4644328365bfc33acf0a9ef595bc"><code>4f79aef</code></a>
fix(fetch): enhance fetch API detection; (<a
href="https://github.com/axios/axios/issues/6413">#6413</a>)</li>
<li>Additional commits viewable in <a
href="https://github.com/axios/axios/compare/v1.6.8...v1.7.4">compare
view</a></li>
</ul>
</details>
<br />


[![Dependabot compatibility
score](https://dependabot-badges.githubapp.com/badges/compatibility_score?dependency-name=axios&package-manager=npm_and_yarn&previous-version=1.6.8&new-version=1.7.4)](https://docs.github.com/en/github/managing-security-vulnerabilities/about-dependabot-security-updates#about-compatibility-scores)

Dependabot will resolve any conflicts with this PR as long as you don't
alter it yourself. You can also trigger a rebase manually by commenting
`@dependabot rebase`.

[//]: # (dependabot-automerge-start)
[//]: # (dependabot-automerge-end)

---

<details>
<summary>Dependabot commands and options</summary>
<br />

You can trigger Dependabot actions by commenting on this PR:
- `@dependabot rebase` will rebase this PR
- `@dependabot recreate` will recreate this PR, overwriting any edits
that have been made to it
- `@dependabot merge` will merge this PR after your CI passes on it
- `@dependabot squash and merge` will squash and merge this PR after
your CI passes on it
- `@dependabot cancel merge` will cancel a previously requested merge
and block automerging
- `@dependabot reopen` will reopen this PR if it is closed
- `@dependabot close` will close this PR and stop Dependabot recreating
it. You can achieve the same result by closing it manually
- `@dependabot show <dependency name> ignore conditions` will show all
of the ignore conditions of the specified dependency
- `@dependabot ignore this major version` will close this PR and stop
Dependabot creating any more for this major version (unless you reopen
the PR or upgrade to it yourself)
- `@dependabot ignore this minor version` will close this PR and stop
Dependabot creating any more for this minor version (unless you reopen
the PR or upgrade to it yourself)
- `@dependabot ignore this dependency` will close this PR and stop
Dependabot creating any more for this dependency (unless you reopen the
PR or upgrade to it yourself)
You can disable automated security fix PRs for this repo from the
[Security Alerts
page](https://github.com/software-mansion/react-native-reanimated/network/alerts).

</details>

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Krzysztof Piaskowy <krzysztof.piaskowy@swmansion.com>
Copy link
Member

@piaskowyk piaskowyk left a comment

Choose a reason for hiding this comment

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

good job 👍

@Latropos Latropos added this pull request to the merge queue Aug 26, 2024
Merged via the queue into main with commit 4d46216 Aug 26, 2024
10 checks passed
@Latropos Latropos deleted the acynk/implement-measure-android branch August 26, 2024 08:03
Latropos added a commit that referenced this pull request Aug 26, 2024
## Summary
Implement measurement of relative coordinates on Android.

## Test plan
I've added more logic to runtime tests to include parent component
changes in calculations.


<details><summary> Example code to log measurement </summary>

```tsx
import React from 'react';
import { Button, StyleSheet, View } from 'react-native';
import type { MeasuredDimensions } from 'react-native-reanimated';
import Animated, {
  measure,
  runOnUI,
  useAnimatedRef,
  useSharedValue,
} from 'react-native-reanimated';

const EXPECTED_MEASUREMENT = {
  height: 100,
  pageX: 302,
  width: 80,
  x: 120,
  y: 150,
};

export default function App() {
  const animatedRef = useAnimatedRef<Animated.View>();

  const measurement = useSharedValue<MeasuredDimensions | null>(null);

  const handlePress = () => {
    runOnUI(() => {
      'worklet';
      measurement.value = measure(animatedRef);
      console.log(measurement.value);
    })();
  };

  return (
    <View style={styles.container}>
      <View style={styles.bigBox}>
        <Animated.View ref={animatedRef} style={styles.box} />
      </View>
      <Button onPress={handlePress} title="Click me" />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
  },
  bigBox: {
    position: 'absolute',
    top: 0,
    left: EXPECTED_MEASUREMENT.pageX - EXPECTED_MEASUREMENT.x,
    height: 300,
    width: 300,
    borderColor: '#b58df1',
    borderWidth: 2,
  },
  box: {
    top: EXPECTED_MEASUREMENT.y,
    left: EXPECTED_MEASUREMENT.x,
    height: EXPECTED_MEASUREMENT.height,
    width: EXPECTED_MEASUREMENT.width,
    backgroundColor: '#b58df1',
  },
});

```
</summary>
tjzel pushed a commit that referenced this pull request Aug 28, 2024
## Summary
Implement measurement of relative coordinates on Android.

## Test plan
I've added more logic to runtime tests to include parent component
changes in calculations.


<details><summary> Example code to log measurement </summary>

```tsx
import React from 'react';
import { Button, StyleSheet, View } from 'react-native';
import type { MeasuredDimensions } from 'react-native-reanimated';
import Animated, {
  measure,
  runOnUI,
  useAnimatedRef,
  useSharedValue,
} from 'react-native-reanimated';

const EXPECTED_MEASUREMENT = {
  height: 100,
  pageX: 302,
  width: 80,
  x: 120,
  y: 150,
};

export default function App() {
  const animatedRef = useAnimatedRef<Animated.View>();

  const measurement = useSharedValue<MeasuredDimensions | null>(null);

  const handlePress = () => {
    runOnUI(() => {
      'worklet';
      measurement.value = measure(animatedRef);
      console.log(measurement.value);
    })();
  };

  return (
    <View style={styles.container}>
      <View style={styles.bigBox}>
        <Animated.View ref={animatedRef} style={styles.box} />
      </View>
      <Button onPress={handlePress} title="Click me" />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
  },
  bigBox: {
    position: 'absolute',
    top: 0,
    left: EXPECTED_MEASUREMENT.pageX - EXPECTED_MEASUREMENT.x,
    height: 300,
    width: 300,
    borderColor: '#b58df1',
    borderWidth: 2,
  },
  box: {
    top: EXPECTED_MEASUREMENT.y,
    left: EXPECTED_MEASUREMENT.x,
    height: EXPECTED_MEASUREMENT.height,
    width: EXPECTED_MEASUREMENT.width,
    backgroundColor: '#b58df1',
  },
});

```
</summary>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants