Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Select an option

  • Save dominicstop/0dc1f56b14d6e96e4755398afbdb8caf to your computer and use it in GitHub Desktop.

Select an option

Save dominicstop/0dc1f56b14d6e96e4755398afbdb8caf to your computer and use it in GitHub Desktop.
2024-06-19 - OSS Library Status + Report

2024-06-19 - OSS Library Status + Report

Metadata



Timeline

  • 2024-06-06-19:32-GMT+8 - react-native-ios-utilities
  • 2024-06-07-18:43-GMT+8 - react-native-ios-utilities
    • Branch: wip-new-arch (current changes | all changes)
    • Release: v5.0.0-1 (changes), v5.0.0-2 (changes),
    • Desc: Compatibility fix for react-native-ios-modal, and impl. RNIContentViewParentDelegate.reactSubviews + RNIContentViewParentDelegate.requestToRemoveReactSubview.

  • 2024-06-13-12:09-GMT+8 - ConfigBasedModal (all changes)
    • Desc: Initial scaffolding for ConfigBasedModal - Setup example, example components, helpers, etc.
      • Impl. AttributedStringConfig + FontConfig - Currently used for making the example cards, but this can be used in the future to create/represent "rich text" (e.g. text with image attachments, rich text input component, labels that contain SFSymbols or images via NSAttachment, etc).
      • Impl. reusable components for making examples and tests.
      • Impl. helper extensions for UIViewController (e.g. for getting child VC items, and modal-related info).

  • 2024-06-15-12:06-GMT+8 - ConfigBasedModal (all changes)
    • Desc: Impl. basic modal presentation + modal focus and presentation state.
      • Impl. ValueInjectable - Used to inject properties via associated objects at runtime; will be used to impl. per instance swizzling.

  • 2024-06-17-16:44-GMT+8 - ConfigBasedModal (all changes)
    • Desc: Impl. modal focus and presentation logic + events, and initial impl. for ModalEventsReporting.
      • Impl. helpers + logic for getting the system/default modal gesture for sheet-based modals.

  • 2024-06-18-19:51-GMT+8 - DGSwiftUtilities (all changes)
    • Release: 0.22.0 (changes), 0.22.1 (changes)
    • Desc: Imported sources from ConfigBasedModal

  • 2024-06-18-20:01-GMT+8 - ConfigBasedModal (all changes)
    • Desc: Update + bump min. version for package: DGSwiftUtilities, and remove temp. sources + replace w/ imports from DGSwiftUtilities.
      • Add dep. to VisualEffectBlurView.

  • 2024-06-18-22:02-GMT+8 - VisualEffectBlurView (all changes)
    • Desc: Add dependency to DGSwiftUtilities, and remove duplicate/redundant sources.

  • 2024-06-19-17:25-GMT+8 - VisualEffectBlurView (all changes)
    • Release: 2.0.0 (changes)
    • Desc: Rewrite object wrappers - Remove HashedStringDecodable, ObjectWrapper, ObjectWrapping, and replace usage w/ ObjectWrapper + PrivateObjectWrapper from DGSwifrUtilities.

  • 2024-06-21-09:14-GMT+8 - VisualEffectBlurView (all changes)
    • Desc: Initial impl. for LayerFilterWrapper.

  • 2024-06-21-11:04-GMT+8 - DGSwiftUtilities (all changes)
    • Release: 0.23.0 (changes), 0.23.1 (changes)
    • Desc: Imported sources from VisualEffectBlurView, and impl. helpers for VisualEffectBlurView.

  • 2024-06-21-13:33-GMT+8
    • Desc: Check dependents of DGSwiftUtilities, and upgrade/update.
    • Attachments: dependency-tree (snapshot | latest)
    • 2024-06-21-12:03-GMT+8 - VisualEffectBlurView (changes)
      • Desc: Raise min. dependency to DGSwiftUtilities.

    • 2024-06-21-12:19-GMT+8-ย ConfigBasedModal (changes)
      • Desc: Raise min. dependency to DGSwiftUtilities.

    • 2024-06-21-12:29-GMT+8- ComputableLayoutย  (changes)
      • Desc: Update DGSwiftUtilities package and check if it compiles.

    • 2024-06-21-12:40-GMT+8- ContextMenuAuxiliaryPreview (changes)
      • Desc: Update DGSwiftUtilities package and check if it compiles.

    • 2024-06-21-13:06-GMT+8- adaptive-modal (branch: main - changes)
      • Desc: Update DGSwiftUtilities package and check if it compiles.

    • 2024-06-21-13:08-GMT+8- adaptive-modal (branch: wip-3.x.x - changes | all changes)
      • Desc: Raise min. dependency to DGSwiftUtilities, and replace usage w/ impl. from DGSwiftUtilities.

  • 2024-06-21-21:56-GMT+8 - VisualEffectBlurView
  • 2024-06-22-07:24-GMT+8 - VisualEffectBlurView
  • 2024-06-23-22:09-GMT+8 - VisualEffectBlurView
  • # 2024-06-24-13:20-GMT+8 - VisualEffectBlurView
    • CAColorMatrix is a c struct that is a 5x4 float matrix, so it has 20 float members.
    • The struct is defined in: QuartzCore-Structs.h (e.g. <QuartzCore/CAColorMatrix.h>), and is defined like this:
      • float m11, m12, m13, m14, m15;
      • float m21, m22, m23, m24, m25;
      • float m31, m32, m33, m34, m35;
      • float m41, m42, m43, m44, m45;

    • NSValue says the size is 80 byte.
      • A float is typically 4 bytes, so: 4 bytes per float * 20 float members = 80 bytes total. There is no extra bytes for alignment.
      • A 2 digit hex number (e.g. FF) is 2 bytes and can represent 256 numbers,
      • UInt8 is 1 byte (8 bits), and UInt16 is 2 bytes, UInt32 is 4 bytes, and UInt64 is 8 bytes.
      • As such you will need 4 digit hex to represent a UInt32.

    • The first 4 "8 byte/UInt64/64bit" values are always: 0x31b16f3f 66cba4be abad7dbd 00000000, this indicates that it's an actual value and not garbage.
      • Pointing NSValue.getValue to a buffer of size 80, with alignment of: MemoryLayout<UInt32> yields: 31 b1 6f 3f 66 cb a4 be.
      • The first 4 bytes (i.e. 31 b1 6f 3f), matches: 0x31b16f3f, and has a little endian float value: 0.9362975.
      • The next 4 bytes (i.e. 66 cb a4 be), matches: 66cba4be, and has a little endian float value: -0.3218643.
      • for ratio of "20 floats" : "80 bytes" (assuming 2 floats are packed into 8 bytes), need to offset by 9 to read all 20 floats.
      • Assumption: "2 floats are packed into 8 bytes" because it's exactly 64 bits, and ios is running on ARM64, so it's aligned to always use 8 bytes for addressing.
      • Create buffer via var buffer = [UInt32](repeating: 0, count: 20), and then write the raw bytes via: inputColorMatrix.getValue(&buffer, size: 80)
        • Array size = 20
        • index 0-3: [0.9362975, -0.3218643, -0.0619332, 0.0]
        • index 4-7: [0.04874998, -0.1635529, 0.7786505, -0.06259762]
        • index 8-11: [0.0, 0.04874998, -0.1642173, -0.3208677]
        • index 12-15: [1.037585, 0.0, 0.04875004, 0.0]
        • index 16-19: [0.0, 0.0, 1.0, 0.0]

      • This doesn't look right, via swizzling [NSValue description], we get the ff. output: vibrantColorMatrix[inputColorMatrix] = CAColorMatrix:
        • {0.936297, -0.321864, -0.061933, 0.000000, 0.048750}
        • {-0.163553, 0.778651, -0.062598, 0.000000, 0.048750}
        • {-0.164217, -0.320868, 1.037585, 0.000000, 0.048750}
        • {0.000000, 0.000000, 0.000000, 1.000000, 0.000000}

      • Via debugger, inspecting CAColorMatrix yields: (CAColorMatrix) colorMatrix
        • m11 = 0.936297476, m12 = -0.321864307, m13 = -0.0619332008, m14 = 0, m15 = 0.0487499796.
        • m21 = -0.163552895, m22 = 0.778650522, m23 = -0.0625976175, m24 = 0, m25 = 0.0487499796.
        • m31 = -0.164217293, m32 = -0.320867687, m33 = 1.03758502, m34 = 0, m35 = 0.0487500392.
        • m41 = 0, m42 = 0, m43 = 0, m44 = 1, m45 = 0.

      • The values returned by _UIVisualEffectFilterEntry.identityValues:
        • m11: 1.0, m12: 0.0, m13: 0.0, m14: 0.0, m15: 0.0,
        • m21: 0.0, m22: 1.0, m23: 0.0, m24: 0.0, m25: 0.0,
        • m31: 0.0, m32: 0.0, m33: 1.0, m34: 0.0, m35: 0.0,
        • m41: 0.0, m42: 0.0, m43: 0.0, m44: 1.0, m45: 0.0

    • The concrete value might be:
      • redPrimary={0.936297 -0.321864 -0.061933 0.000000}
      • greenPrimary={-0.163553 0.778651 -0.062598 0.000000}
      • bluePrimary={-0.164217 -0.320868 1.037585 0.000000}
      • alphaPrimary={0.000000 0.000000 0.000000 1.000000}
      • additiveColor={0.048750 0.048750 0.048750 0.000000}

    • The objc type is not stable across runs/compiles, but stable across the entire lifecycle of the app.
      • NSValue.objCType is of type: UnsafePointer<CChar>
      • Docs: This property provides the same string produced by the @encode() compiler directive.

    • What i don't understand is why is CAColorMatrix have uneven rows/columns?
    • Mapping: Matrix -> color components (incomplete)
      • redPrimary ย  ={m11 m12 m13 ???}
      • greenPrimary ={m21 m22 m23 ???}
      • bluePrimary ย ={m31 m32 m33 ???}
      • alphaPrimary ={??? ??? ??? m44}
      • additiveColor={m15 m16 m17 ???}

    • Mapping: Color components -> matrix (incomplete)
      • m11: r1, m12: r2, m13: r3, m14: ??, m15: d1
      • m21: g1, m22: g2, m23: g3, m24: ??, m25: d2
      • m31: b1, m32: b2, m33: b3, m34: ??, m35: d3
      • m41: ??, m42: ??, m43: ??, m44: a4, m45: ??

    • color components (identity):
      • redPrimary ย  ={1 0 0 0}
      • greenPrimary ={0 1 0 0}
      • bluePrimary ย ={0 0 1 0}
      • alphaPrimary ={0 0 0 1}
      • additiveColor={0 0 0 0}

  • # 2024-06-24-21:42-GMT+8 - VisualEffectBlurView (changes)
    • Desc: WIP impl. for VisualEffectView, LayerFilterType, and ColorMatrixRGBA.

  • 2024-06-25-22:47-GMT+8 - VisualEffectBlurView
  • # 2024-07-03-04:11-GMT+8 - VisualEffectBlurView (changes)
    • Attachments: ๐Ÿ“ผ Screen-Recording-2024-07-01-at-07-47-PM.mov
    • Related: ๐Ÿฆ tweet-2024-07-03-05:54-GMT+8
    • Desc: Impl. LayerFilterType, rename symbols, and impl. variableBlur filter.
      • Initial work to rename symbols so that they don't match the private API identifiers.
      • Improvements to PrivateObjectWrapper - Allow for creating instances directly via PrivateObjectWrapper.createInstance, and a "helper" initializer (i.e. PrivateObjectWrapper.init()).
      • Extract the ColorMatrix presets used by UIVibrancyEffect to help with testing.
      • Update ColorMatrixRGBA so that it can be used to configure a filter effect (i.e. LayerFilterType).
      • Impl. LayerFilterType Enum - Used to configure a filter, and set the filter parameters, as well as for creating a layer filter (i.e. via LayerFilterType.createFilterWrapper), and applying the "filter configuration" to a existing layer filter (e.g. via LayerFilterType.applyTo(layerFilterWrapper:)).
      • Impl. LayerFilterType.variadicBlur - Exposes variableBlur filter.
      • Consolidate - Create FilterEntryMetadata type as a unified container for extracting filter-related metadata from the standard UIVisualEffect effects (i.e. UIBlurEffect + UIVibrancyEffect).

  • 2024-07-05-17:00-GMT+8 - VisualEffectBlurView Logs
  • 2024-07-03-04:59-GMT+8 - DGSwiftUtilities (all changes)
    • Release: 0.24.0, 0.24.1, 0.24.2
    • Desc: Imported shared helpers/utilities from VisualEffectBlurView, improvements to example-related components, and various small fixes.

  • 2024-07-06-06:34-GMT+8 - VisualEffectBlurView (changes)
    • Attachments: ๐Ÿ“ผ Render-02-2024-07-06-06-39-51.mp4
    • Related: ๐ŸŽž๏ธ VisualEffectBlurTestViewController.gif, ๐Ÿฆ tweet-2024-07-06-07:20-GMT+8
    • Desc: Creating the methods for VisualEffectView to apply and update the filters.
      • More work to rename classes, enums, and property/dictionary keys so that they don't match the private API identifiers (e.g. replaced prefix UIVisualEffect- w/ UVE-, renamed methods with synonyms. etc).
      • Bumped min. dep. to DGSwiftUtilities from 0.23.0 to 0.24.0, and removed temp. sources that were migrated to DGSwiftUtilities, and replace them with imports.
      • Impl. method to apply the "filter configuration" (i.e. the filter values + filter type) to UVEFilterEntryWrapper via LayerFilterType.applyTo(filterEntryWrapper:).
      • Impl. setting/applying filter effects to VisualEffectView via VisualEffectView.setFiltersViaLayers, and VisualEffectView.setFiltersUsingEffectDesc.
      • Impl. LayerFilterType computed properties for getting the "filter configuration" (i.e. the various filter-related values) as dictionaries.
      • Updated to use "effect descriptors" to set/update the layer filters via:
        • Impl. initializers for UVEFilterEntryWrapper to allow for the creation of _UIVisualEffectFilterEntry via exposing initWithFilterType:configurationValues:requestedValues:identityValues:
        • Impl. UVEDescriptorWrapper methods (i.e. wrapper for _UIVisualEffectDescriptor) to set/update the "filter entries" (e.g. setFilterValuesIdentity, setFilterValuesConfig, updateFilterItems).

  • # 2024-07-06-07:33-GMT+8 - DGSwiftUtilities (all changes)
    • Release: 0.25.0
    • Desc: Imported shared helpers/utilities from VisualEffectBlurView.

  • # 2024-07-06-21:11-GMT+8 - Report Summary
  • 2024-07-24-16:13-GMT+8 - DGSwiftUtilities (all changes)
    • Release: 0.26.0
    • Date Range: 2024-07-10-04:12-GMT+8 -> 2024-07-24-16:13-GMT+8
    • Desc: Impl. interpolation-related helpers based on adaptive-modal using a generic + protocol-oriented approach.

  • 2024-07-26-16:26-GMT+8 - VisualEffectBlurView (all changes)
    • Release: 3.0.0
    • Date Range: 2024-06-19-22:51-GMT+8 -> 2024-07-11-03:44-GMT+8, 2024-07-25-04:55-GMT+8 -> 2024-07-26-16:26-GMT+8.
    • Desc: Exposes custom CALayer filters in VisualEffectView.

  • # 2024-07-26-16:26-GMT+8 - react-native-ios-visual-effect-view (changes)



Draft/Unfinished

WIP Changes - Placeholder for commits/changes that aren't logged yet.

  • N/A

  • TBA
    • In order to use ColorMatrixRGBA/CAColorMatrix, some "Color Transformations" matrix/linear algebra math is needed?
      • So while the matrix looks very complicated, it's representing a RGBA vector; but it's being stored as a matrix to make it easier to "transform" colors via matrix multiplication.

    • Looking at the dumped matrix values, i think it's used for "tinting" the layer, i.e. by adj. the values in the matrix, the "influence" of color channel (rgb) changes, making the view appear tinted towards that color.
    • This is similar to Transform3D (a swift wrapper type for: CATransform3D), however i do not know what values to multiply to achieve tinting yet.
      • I think similar to transforms, by multiplying certain values, color "effects" (e.g. color/hue shifting, brightness, saturation, tinting, etc) can be performed.
      • There seems to be a concept of "rotation" to achieve hue shifting.

    • Although not exactly 1:1, there's a protocol called CIColorMatrix.
      • it has 5 channels i.e. RGBA + something called "bias vector'.
      • Each channel is of type: CIVector, which holds 4 values: x, y, z, and w.
      • This kinda matches CAColorMatrix; they are both 4x5.

    • On further research, i came across YCbCr colorsplace; although YCbCr is using a 3x3 matrix, and CAColorMatrix is 5x4 (rgba + "additive color"), they are sort of similar?
    • Reference Link - "almost any color can be represented as a linear combination of red, green, and blue. But you can transform (or "rotate") that coordinate system such that the three basis elements are no longer RGB."
      • Related Keywords: "color coordinate systems".



Task Dump

  • #f03c15 Task f03c15: Unify animation api/types using the base impl. in adaptive-modal
    • LerpComputable protocol + LerpInterpolator struct.
      • Alternate names: LerpDrivenAnimation
    • LerpComputable: protocol to compose different lerping animation together.
      • Accept an array of โ€œlerp-ableโ€ animation values; Each "entry" has to have name/id so that they can be uniquely identified.
      • Probably Use look up table/dict, because just using an array will have to be ordered.
      • Requirements for protocol: inputValue (e.g. inputPercentValue), inputPercentValue, rangeOutput, and clamping configuration
      • Use cache for rangeOutput.
      • Driven by percentage; receives a percent, computes lerp, then applies the value to target.
      • LerpComputable has the logic to compute the lerp/interpolated value for types: CGRect, CGSize, UIColor, etc.

    • Somehow apply lerp result to some target (e.g. property) via:
      • Target object + keypath
      • Accept block that gets continuously invoked; block receives new value.

    • Clamping config; each "lerpable" type will have a "clamping config" set type.
    • Config used create a lerping function that can be cached, and recreated from scratch.

  • #f03c15 Task #a4ded7: Unify keyframe based animation (based on adaptive-modal), and make lerp + keyframe based animations work together.
    • Common keyframe configuration than can be specialized/customized.
    • The animation can be animated to a "keyframe position" either manually using a percent, or via UIViewPropertyAnimator.
    • Track the various states; the current keyframe, animation state, etc. should be tracked.
    • A bunch of keyframes (KeyframeGroup?) will produce LerpComputable, and will be given to LerpInterpolator to manually drive the interpolation animation (e.g. via a gesture) using a CGFloat percent.
      • Experiment - If the animation is simple enough, use UIViewPropertyAnimator to drive all animations; past testing did not work, try again.
      • Given 2 keyframe items, keyframeStart and keyframeEnd (which can be a single keyframe, or multiple), there is enough info to create UIViewPropertyAnimator.

    • There should be a way for animations that don't work with UIView.animate/CABasicAnimation to be "animated" (i.e. animations that are manually driven by CADisplayLink).
    • Concept: A KeyframeItem = something like: {a: 0, b: 1}
      • KeyframeGroup = something like: [{a: 0}, {b: 0}, {a: 1, b: 1}]
      • Computing KeyframeGroup results in name-tba-foo, which is something like: [{a:0,b:0}, {a:0,b:0}, {a:1,b:1}] or: [{a:0,b:0}, {a:0.5,b:0}, {a:1,b:1}].
      • The former uses "fill in the blanks using the prev. item" (i.e. fillMissingValuesViaCopying mode), and latter uses "fill in the blank using lerp + current position in percent" (i.e. fillMissingValuesUsingLerp).
      • The former (i.e. fillMissingValuesViaCopying) is useful for animation that have "snapping" points.
        • In other words, animations that have "discrete steps" where a "in-between"/interpolated value does not make sense.
        • E.g. like the snapping points in adaptive-modal.

      • The latter (i.e. fillMissingValuesUsingLerp) is more useful for animations that happen "fluidly"
        • In other words, animations that happen "all in one go" w/ a set duration that may or may not be interrupted.
        • E.g. this will be useful for standalone animations, like animating to a blur radius in VisualEffectBlurView.

      • name-tba-foo is composed of individual steps which will be called: name-tba-bar-item.
      • What we have so far:
        • KeyframeGroup is composed of KeyframeItem.
        • KeyframeItem has gaps/missing values.
        • KeyframeGroup can be "computed" to produce name-tba-foo.
        • name-tba-foo is composed of name-tba-bar-item.
        • name-tba-bar-item does not have any gaps or missing values.

    • Concept: KeyframeItem, KeyframeGroup -> InterpolationPoint

  • #f03c15 Task #7caf2d: Create the config type for ConfigBasedModal
    • Possible modal config items: overlay, modalBackground, modalDragIndicator.
    • Possible "modal" type: basicSheet
      • Config item - modalBackgroundEffect: systemBlurEffect, customEffect, customEffectWithAppearance
      • Config item - modalAccessoryView
      • Config item - modalDragIndicator.

    • Possible "modal" type: basicSheetWithKeyframes
      • Config item - shouldAllowGestureToDriveAnimation
      • Config item - startKeyframe
      • Config item - endKeyframe

    • Struct type: ModalAccesoryConfig
      • modes: edge, stretch
      • edgeAnchor: top, outerTop, bottom, outerBottom, bottom, etc.
      • stretch, center, leading trailing
      • viewProvider:
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment